Почему возвращает undefined?

Question

[imeyuves]

Не пойму почему переменная store - undefined

import FormCreate from "@/components/FormCreate.vue"
import FormUser from "@/components/FormUser.vue"
import { defineComponent } from 'vue'
import {postForm} from "@/stores/form"

export default defineComponent({
  setup() {
    const stores = postForm()
    return {stores}
  },
  methods: {
    onLogin(data) {
      console.log(this.stores)
    }
  }
})

postForm - это объект из скрипта form который использует pinia

import { defineStore } from 'pinia'


export const postForm = defineStore('form', {
  state: () => ({
    form: []
  }),

  actions: {
    postUser(data, site) {
      fetch(`http://localhost:5002/api/${site}`, {
        method: "POST",
        headers: {
          'Content-type': "multipart/form-data"
        },
        body: data
      })
      .then(res => this.form = res)
    },
  }
})

Answer 1

[imeyuves]

Прислушался к Aetae и вместо того что бы месить Options Api с Composition Api сделал так:

import {VueFinalModal} from 'vue-final-modal'
import {Icon} from '@iconify/vue'
import FormCreate from "@/components/FormCreate.vue"
import FormUser from "@/components/FormUser.vue"
import {useFormStore} from "@/stores/form"

const stores = useFormStore()

async function onLogin(data) {
  await stores.postUser(data)
}

Не шипко красиво, но главное работает

form.js

import { defineStore } from 'pinia'


export const useFormStore = defineStore('form', {
  state: () => ({
    form: []
  }),

  actions: {
    postUser(data) {
      fetch('http://localhost:5002/api/user/login', {
        method: 'POST',
        headers: {
          "Content-Type": "application/json"
        },
        body: JSON.stringify(data)
      })
      .then(res => this.form = res)
  }
}})

Answer 2

[Aetae]

1. Проблема в том, что возвращает твой postForm. Сам по себе приведённых код рабочий. Нужен код postForm.
2. Хотя приведённый код и рабочий - так писать нельзя: ты используешь либо Options Api, либо Composition Api. Не смешивая. Если есть setup - нет methods, если есть methods - нет setup. Да, оно работает. Но это говно. Как Тесла с дизель-генератором в багажнике.

Comments

[imeyuves]

Я только недавно начал использовать pinia, и этот код я взял из примеров их документации

ps: добавил код postForm

[Aetae]

imeyuves, всё работает.
Ищи проблему в другом месте.

И придерживайся конвенций наименования. Фунция которая получает стор не должна называться postForm - это ложь. Никакую форму она не постит. Это вводит в заблуждение. Она должна называться useFormStore - use как указание, что это на хук(может применяться только в setup), Form - наименование стора, Store - указание что это store, а не просто какой-то функционал управления формой.