vue3 新建文件store自动导入

  1. store下新增个index.js用来做自动导入(pinia使用可参考之前这篇文章
javascript 复制代码
//使用pinia来管理全局状态
import { createPinia } from 'pinia'
// 自动导入所有 store 文件
const modulesFiles = import.meta.glob('./modules/*.js', { eager: true })
const stores = {}

for (const path in modulesFiles) {
  const moduleName = path.replace(/^\.\/modules\/(.*)\.\w+$/, '$1')
  stores[moduleName] = modulesFiles[path].default
}
// 安装所有 store
export const setupStore = (app) => {
  const pinia = createPinia()
  app.use(pinia)
  // 注册所有 store
  Object.keys(stores).forEach(key => {
    if (stores[key] && typeof stores[key] === 'function') {
      stores[key]()
    }
  })
  
  return pinia
}
// 导出所有 store
export default stores
  1. mian.js引入setupStore文件
javascript 复制代码
import { setupStore } from './store'
const app = createApp(App)
setupStore(app)
相关推荐
海南java第二人4 小时前
SpringBoot启动流程深度解析:从入口到容器就绪的完整机制
java·开发语言
星火开发设计4 小时前
C++ queue 全面解析与实战指南
java·开发语言·数据结构·c++·学习·知识·队列
码界奇点4 小时前
基于Vue3与TypeScript的后台管理系统设计与实现
前端·javascript·typescript·vue·毕业设计·源代码管理
DICOM医学影像4 小时前
2. go语言从零实现以太坊客户端-查询区块链账户余额
开发语言·golang·区块链·以太坊·web3.0·hardhat
ashcn20014 小时前
水滴按钮解析
前端·javascript·css
攀登的牵牛花4 小时前
前端向架构突围系列 - 框架设计(五):契约继承原则
前端·架构
爱吃奶酪的松鼠丶4 小时前
React长列表,性能优化。关于循环遍历的时候,key是用对象数据中的ID还是用索引
javascript·react.js·性能优化
Data_agent5 小时前
Python 编程实战:函数与模块化编程及内置模块探索
开发语言·python
new_zhou5 小时前
vs2019+qt工程中生成dump文件及调试
开发语言·qt·visual studio·dump调试
xkxnq5 小时前
第二阶段:Vue 组件化开发(第 17天)
javascript·vue.js·ecmascript