vue开发中如何在js文件里使用pinia和组件同步
更新时间：2024年10月17日 09:59:41 作者：从来风花雪月无常
在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和组件同步内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要介绍了vue页面跳转实现页面缓存操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-07-07
这篇文章主要为大家总结了vue2.0开发实践的疑难,具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-12-12
这篇文章主要介绍了Electron-vue开发的客户端支付收款工具的实现，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2019-05-05
在团体开发项目中,为了团队所有成员书写可维护的代码,而不是一次性的代码,让团队当中其他人看你的代码能一目了然,下面这篇文章主要给大家介绍了关于Vue前端书写规范的相关资料,需要的朋友可以参考下2023-01-01
这篇文章主要介绍了Vue3之状态管理器(Pinia)详解及使用方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-03-03
今天小编就为大家分享一篇vue 父组件通过$refs获取子组件的值和方法详解，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-11-11
这篇文章主要介绍了解决elementui导航折叠卡顿的问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-07-07
这篇文章主要介绍了vue实现自定义公共组件及提取公共的方法，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-05-05
这篇文章主要介绍了vue elementUI 处理文件批量上传方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-04-04
这篇文章主要介绍了Vuex之module使用方法及场景说明,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2023-10-10
最新评论