Rails + Nuxtで複数モデルに同時保存

実現したいこと

画像を添付して投稿すると、GirlテーブルとImageテーブルに同時にデータを保存できるようにしたい
名前(name)、詳細(text)、画像(image)を入力して投稿すると、Girlテーブルのnameとtextに入力した値が入り、imageテーブルのdetailに画像が入るという感じにしたいです
Rails(api)とNuxt.jsを使用しています
よろしくお願いします

こちらのRails+Nuxtバージョンをやりたいです

前提 + ソース

Girlテーブル

id	name	text

Imageテーブル

アソシエーション

girl.rb

ruby

class Girl < ApplicationRecord has_many :images accepts_nested_attributes_for :imagesend

image.rb

ruby

class Image < ApplicationRecord belongs_to :girl mount_uploaders :image, ImageUploaderend

コントローラー

Girls.contoller

ruby

class Api::V1::GirlsController < ApplicationController def new end def create girl = Girl.create(girl_params) if girl.save render json: girl, status: :created else render json: { errors: girl.errors.keys.map { |key| [key, girl.errors.full_messages_for(key)]}.to_h, render: 'show.json.jbuilder' }, status: :unprocessable_entity end end private def girl_params params.permit(:name,:text,images_attributes: {image: []}) endend

投稿画面(New.vue)

javascript

<template> <div class="contens row mx-auto"> <form> <v-text-field v-model="name" type="text" label="人"></v-text-field> <v-text-field v-model="text" type="text" label="詳細"></v-text-field> <v-file-input @change="setImage" label="画像" accept="image/png, image/jpeg, image/bmp"/> </form> <b-button @click="createGirl" type="submit" color="info" class="text-white mt-5 mb-5">投稿する</b-button> </div></template> <script>export default { data: ()=>{ return { name: '', text: '', image: null, errors: '', } }, methods: { createGirl() { let formData = new FormData(); formData.append("name", this.name); formData.append("text", this.text); const config = { headers: {"content-type": "multipart/form-data",} }; if (this.image !== null) { formData.append("image", this.image); } this.$axios .post('/api/v1/girls',formData,config) .then(response => { }) .catch(error => { if (error.response.data && error.response.data.errors) { this.errors = error.response.data.errors; } }); }, setImage(e){ this.image = e } }}</script> <style> </style>

発生している問題・エラーメッセージ

画像を添付した後保存しようとすると、保存できずgirl_paramsの中身を見てみると下記のように表示され、パラメーターの中にimageが入っていませんでした

Unpermitted parameter: :image #<ActionController::Parameters {"name"=>"test", "text"=>"test"} permitted: true>

試したこと

パラメーターを色々変更してみましたが結果は変わりませんでした

ruby

def girl_params params.require(:girl).permit(:name,:text,images_attributes: {image: []}) end def girl_params params.permit(:name,:text,images_attributes: {detail: []}) end