我想保存从 Nuxt.js 发送到 Rails 的数据

Question

我想实现的

我想保存从Nuxt.js发送到Rails的数据。 Rails 正在尝试使用 accepts_nested_attributes_for

关联存储数据

代码

Rails
model/post.rb

class Post < ApplicationRecord
    has_many :post_items, dependent: :destroy
    accepts_nested_attributes_for :post_items, allow_destroy: true

    validates :title, presence: true
    validates :author, presence: true
    validates :image, presence: true
end

model/post_item.rb

class PostItem < ApplicationRecord
 belong_to :post
end

app/controller/posts_controller

class Api::V1::PostsController < ApplicationController
    def index
        posts = Post.all
        render json: posts
    end

    def create
        post = Post.new(post_params)
        if post.save
            render json: 'Succeeded', status: 200
        else
            render json: 'Error', status: 500
        end
    end

        private
         def post_params
            params.require(:post).permit(:title, :author, :image, post_items_attributes: [:content, :status])
         end
end

Nuxt.js

store/todos.js

export const state = () => ({
  list: [],
  hidden: false
})

export const mutations = {
    add (state, text) {
    state.list.push({
      text,
      status: false
    })
  },


  remove (state, todo) {
    state.list.splice(state.list.indexOf(todo), 1)
  },


  edit (state, { todo, text }) {
    state.list.splice(state.list.indexOf(todo), 1, { text })
  },


  toggle (state, todo) {
    todo.status = !todo.status
  },


  cancel (state, todo) {
    todo.status = false
  },

  switching (state) {
    state.hidden = !state.hidden
  }
}

// Rails send
export const actions = {

  postTextAdd ({ commit }, content) {
    const postAxios = this.$axios.$post
    const url = '/api/v1/'

    postAxios(url + 'posts', {
      post: {
        post_items_attributes: {
          content: 'test',
          status: false
        }
      }
    })
      .then((response) => { 
        commit('add', response)
        console.log(response)
      })
  }
}

模板

・・・

  methods: {
    addTodo () {
      // postTextAddでRailsに送る
      if (this.selectedTodo.status === false) {
        this.$store.dispatch('todos/postTextAdd', this.itemText)
        this.itemText = ''
        console.log(this.todos)
      } else {
        this.$store.commit('todos/edit', { todo: this.selectedTodo, text: this.itemText })
        this.itemText = ''
        this.$store.commit('todos/toggle', this.selectedTodo)
      }
    },

错误

航站楼

api_1    | Started POST "/api/v1/posts" for 192.168.96.1 at 2021-08-06 07:41:38 +0900
api_1    | Processing by Api::V1::PostsController#create as HTML
api_1    |   Parameters: {"post"=>{"post_items_attributes"=>{"content"=>"test", "status"=>false}}}
api_1    | Completed 500 Internal Server Error in 27ms (ActiveRecord: 0.0ms | Allocations: 4188)
api_1    | 
api_1    | 
api_1    |   
api_1    | TypeError (no implicit conversion of Symbol into Integer):
api_1    |   
api_1    | app/controllers/api/v1/posts_controller.rb:8:in `create'

我自己试过的

① api_1 | app/controllers/api/v1/posts_controller.rb:8:in `create'

        def create
        post = Post.new(post_params)
        if post.save
            render json: 'Succeeded', status: 200
        else
            render json: 'Error', status: 500
        end
    end

我查了上面的，不知道是不是跟报错有关，因为create只是保存而已

② TypeError (no implicit conversion of Symbol into Integer): 我认为 Nuxt 发送的数据和 Rails 接收的数据是不同的，但是当我在 Rails 文档中查找时，我找不到除符号之外的任何内容。

Answer 1

您的问题出在嵌套参数中。嵌套属性以散列数组的形式出现，而不是散列。所以如果你改变这个：

post: {
        post_items_attributes: {
          content: 'test',
          status: false
        }
      }

至：

post: {
        post_items_attributes: [{
          content: 'test',
          status: false
        }]
      }

应该可以。好吧，您将从一个错误转移到另一个错误，因为您的 Post 模型验证将在接下来进行。

我想保存从 Nuxt.js 发送到 Rails 的数据

I want to save the data sent from Nuxt.js to Rails

javascript

ruby-on-rails

vue.js

vuex

nuxt.js

我想实现的

代码

错误

我自己试过的