21 vue3 vuex的安装配置

上一篇：

20.0 vue3 vue-router路由跳转，参数（query，params）的传递与接收（包括请求操作）_十一月的萧邦-CSDN博客

本篇主要记录vuex的安装配置，官网：Vuex 是什么？ | Vuex

1.创建vue3项目（不再详细说明）

2.安装vuex

命令：

npm install vuex@next --save

完成如下

3.src下新建store文件夹 下新建index.js，目录如下

index.js中写入如下代码

import {createStore} from 'vuex'

// 创建一个新的 store 实例
const store = createStore({
    state() {
        return {
            name: '小米King'
        }
    }
})

export default store

 4.main.js

 5.测试是否可以取值成功，找到任意页面，或者组件

<template>
  <div>
    {{ name }}
  </div>
</template>

<script>
import {useStore} from "vuex" //1.从vuex中引入useStore

export default {
  name: "Test",
  setup() {
    let {name} = useStore().state  //2.取值

    return {
      name   //3.return出去
    }
  }
}
</script>

 6.页面展示---success

下一篇：

22 vue3 vuex state取值操作_十一月的萧邦-CSDN博客