rails vue でファイルのアップロード

タイトルの通りなのですが、carrierwaveを使ってaxiosを使い画像ファイルをアップロードしたいのですが、404エラーが出てしまいます。というかこのやり方でアップロード出来るのかもまだわからないのですが…

開発環境は
linux
ruby 2.6.6
rails 6.0
vue　2.6.11,

routes.rb

Rails.application.routes.draw do
  root  'pages#index'
  post "posts"      => "posts#create"
  devise_for :users
end

posts_controller.rb

class PostsController < ApplicationController

 belongs_to :users

 def create
  @post = current_user.posts.build(post_params)
  if @post.save
    render json: @post, status: :created
  else
    render json: @post.errors, status: :unprocessable_entity
  end
end

private

  def posts_params
    params.require(:post).permit(:content, :pictur)
  end
end

app.vue

<template>
  <div id="app" class="container">
    <router-view></router-view>
    <!-- <show></show> -->
     <form v-on:submit.prevent="postItem()">

      <p>
        <label>content</label>
        <input name="post.content" type="text" v-model="post.content"><br />
      </p>
      <p>
        <label>画像</label>
        <input name="uploadedImage" type="file" ref="file" v-on:change="onFileChange()"><br />
      </p>
      <input type="submit" value="Submit">
    </form>
  </div>
  
</template>

<script>
import axios from 'axios'
// import show from './packs/components'
export default {
  // comments:{
  //   show
  // },
   data() {
    return {
      post: {},
      uploadedImage: ''
    }
  },
  methods: {
    onFileChange() {
      let file = event.target.files[0] || event.dataTransfer.files
      let reader = new FileReader()
      reader.onload = () => {
        this.uploadedImage = event.target.result
        this.post.image = this.uploadedImage
      }
      reader.readAsDataURL(file)
    },
    postItem() {
      return new Promise((resolve, _) => {
        axios({
          url: '/posts',
          data: {
            post: this.post
          },
          method: 'POST'
        }).then(res => {
          this.book = {}
          this.uploadedImage = ''
          this.$refs.file.value = ''
          resolve(res)
        }).catch(e => {
          console.log(e)
        })
      })
    }
  }
};
</script>

<style scoped>
.container {
  width: 935px;
}
p {
  font-size: 2em;
  text-align: center;
}
</style>

これで送信ボタンのSubmitを押すとコンソールで404が出てしまい、networkのpriviewには
Unknown action

The action 'create' could not be found for PostsControllerとでます。

routes.rbにはちゃんと書いてあると思うのですがどうすれば良いのでしょうか？
どうかご助力いただけたらと思います。