[pinia快速入门]4.使用其他的store

在这个例子中，我们在新写一个permissionStore，来存储我们的权限数组，这个store中我们需要使用到之前定义的profileStore。其实用起来很简单，直接导入进来使用就行了：
新加的权限模块的store，文件名为permissionStore.js:

import { defineStore } from 'pinia'
import { useProfileStore } from './profileStore' // 导入其他的store
export const usePermissionStore = defineStore('permission', {
  state() {
    return {
      list: ['add', 'delete', 'update', 'query'], // 权限列表
    }
  },
  getters: {
    permissionList(state) {
      const profileStore = useProfileStore()
      if (profileStore.userName === '林哥') { // 如果用户名是‘林哥’，那么有所有权限
        return ['*']
      } else {
        return state.list
      }
    },
  },
})

然后我们在App.vue中使用permissionStore就行了，我们还是简化一下，把权限显示在页面上就行了：

<template>
  <div>用户名是： {{ profileStore.userName }}</div>
  <div>手机号是： {{ profileStore.phoneHiddenPlus('+86') }}</div>
  <div>权限列表是： {{ permissionStore.permissionList }}</div>
</template>

<script setup>
import { onMounted } from 'vue'
import { useProfileStore } from './store/profileStore'
import { usePermissionStore } from './store/permission' // 新增
const profileStore = useProfileStore()
const permissionStore = usePermissionStore() // 新增
onMounted(() => {
  profileStore.login('林哥', '9527')
})
</script>

最后页面就可以显示出权限：

用户名是： 林哥
手机号是： +86188****8888
权限列表是： [ "*" ]

这样跨模块的store互相调用就完成了，就是这么简单。

关于pinia的入门教程就到这里了，有关pinia更详细的文档我已经翻译成了中文，可以在开发时候查阅
pinia中文文档