Проблема отправки данных в Rails API из приложения Vue

Question

Привет всем, у меня есть Rails 6 API, который я пытаюсь поговорить с моим приложением Vue.

Когда я пытаюсь отправить свою форму в URL для регистрации, я получаю эту ошибку:

Started POST "/api/v1/signup" for ::1 at 2019-10-21 20:25:57 -0600
Processing by Api::V1::UsersController#create as JSON
Completed 400 Bad Request in 1ms (ActiveRecord: 0.0ms | Allocations: 922)



ActionController::ParameterMissing (param is missing or the value is empty: user):

app/controllers/api/v1/users_controller.rb:45:in `user_params'
app/controllers/api/v1/users_controller.rb:18:in `create'

Сейчас я все еще довольно новичок в Vue, но я поливал их документы иПрошел кучу вопросов из стека, пробуя разные вещи, но безрезультатно!

Вот как структурированы мои поля ввода: (Я приведу здесь только одно в качестве примера, чтобы сохранить вопрос чистым):

    <div class="w-full lg:w-11/12 mb-2">
      <label for="user_account_attributes_company_name" class="label">Company Name</label>
      <input type="text" name="user[account_attributes][company_name]" v-model="company_name" id="user_account_attributes_company_name" class="form-input w-full" />
    </div>

Сценарий, прикрепленный к моему шаблону, выглядит следующим образом: (я использую Axios)

<script>
export default {
  name: 'Signup',
  props: {
    user: Object
  },
  data () {
    return {
      company_name: '',
      email: '',
      f_name: '',
      l_name: '',
      password: '',
      password_confirmation: '',
      error: ''
    }
  },
  created () {
    this.checkedSigndIn()
  },
  updated () {
    this.checkedSigndIn()
  },
  methods: {
    signup () {
      this.$http.plain.post('/api/v1/signup', {
        user: {
          company_name: this.company_name,
          email: this.email,
          f_name: this.f_name,
          l_name: this.l_name,
          password: this.password,
          password_confirmation: this.password_confirmation
        }
      })
        .then(response => this.signupSuccessful(response))
        .catch(error => this.signupFailed(error))
    },
    signupSuccessful (response) {
      if (!response.data.csrf) {
        this.signupFailed(response)
        return
      }

      localStorage.csrf = response.data.csrf
      localStorage.signedIn = true
      this.error = ''
      this.$router.replace('/dashboard')
    },
    signupFailed (error) {
      this.error = (error.response && error.response.data && error.response.data.error) || 'Something went wrong'
      delete localStorage.csrf
      delete localStorage.signedIn
    },
    checkedSigndIn () {
      if (localStorage.signedIn) {
        this.$router.replace('/dashboard')
      }
    }
  }
}
</script>