vue.js

关注公众号 jb51net

关闭
首页 > 网络编程 > JavaScript > javascript类库 > vue.js > vue 使用pinia和组件同步

vue开发中如何在js文件里使用pinia和组件同步

作者:从来风花雪月无常

在JavaScript文件中封装涉及到使用Pinia的方法时,发现Pinia和组件内容并不同步,二者的状态是独立的,解决办法是,在新建对象的时候,将Pinia作为参数传入,本文给大家介绍vue开发中如何在js文件里使用pinia和组件同步,感兴趣的朋友一起看看吧

遇到问题

在js文件中封装涉及到使用pinia的方法时,发现和组件内容并不同步,二者是互相独立的。为了方便使用,需要在新建对象的时候,将pinia作为参数传进去

只需要传pinia参数就可以

store/index.js

import { defineStore } from "pinia";
import { createPinia } from 'pinia'
export const pinia = createPinia();
export const StoreData = defineStore('storeData',{
state:()=>(
{
carList:[],
carsMessage:{}
}
)
})

main.js

import { pinia } from './store/';
import App from './App.vue';
const app = createApp(App);
app.use(pinia);
app.mount('#app');

js脚本文件使用

import { StoreData,pinia } from "@/store";
const storeData = new StoreData(pinia);// 必须传参数 pinia

这样就可以了,如果没有new StoreData(pinia)传参数,是不会改变的

到此这篇关于vue开发中,在js文件里使用pinia和组件同步的文章就介绍到这了,更多相关vue 使用pinia和组件同步内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

您可能感兴趣的文章:
阅读全文