手机网站趋势,网站安全检测工具,做网站买岩棉,虚拟主机商抛砖引玉: 如果在开发vue3项目是, 引用了npm第三方包 ,而且这个包内使用了Pinia 状态管理库,那我们如何去调用 npm内部的 Pinia 状态管理库呢? 实际遇到的问题:
今天在制作npm包时遇到的问题,之前Vue2版本的时候状态管理库用的Vuex ,当时调用npm包内的状态管理库很简单,直接引…抛砖引玉: 如果在开发vue3项目是, 引用了npm第三方包 ,而且这个包内使用了Pinia 状态管理库,那我们如何去调用 npm内部的 Pinia 状态管理库呢? 实际遇到的问题:
今天在制作npm包时遇到的问题,之前Vue2版本的时候状态管理库用的Vuex ,当时调用npm包内的状态管理库很简单,直接引用包内的store就行了.
但是Vue3 里的Pinia 就不一样了,可能也是第一次遇到这种问题,卡了我一个多小时, 这时候Ai都不好使了,最后还是脑洞大开自己解决了.
整体代码如下:
# 第一步,引用第三方npm包microi-pageengine: ^1.1.0,# 第二步, 调用包内暴露的接口import { formDesigner, EventBus, usePageEngineStore } from microi-pageengine //导入
import microi-pageengine/style.css //引入组件相关样式# 第三步 ,调用组件template!-- 页面设计器 --formDesigner :remoteObjremoteObj /!-- 页面渲染器 --!-- formRenderer :remoteObjremoteObj / --
/template# 第四步
script setup
省略其他代码//这里就是调用第三方npm包内部的pinia状态机方法体,然后就报错了const pageEngineStore usePageEngineStore()pageEngineStore.setToken()省略其他代码
/script 我尝试了各种方法都不行,折腾了好久,后来这样改就好了,要把自己的pinia以参数的形式传给它才行 const pageEngineStore usePageEngineStore( pinia ) // 这个参数是精髓 script setup
其他省略import { createPinia } from pinia
const pinia createPinia()import { formDesigner, EventBus, usePageEngineStore } from microi-pageengine //导入
import microi-pageengine/style.css //引入组件相关样式const pageEngineStore usePageEngineStore(pinia) //这句使精髓其他省略/script
