> For the complete documentation index, see [llms.txt](https://close.gitbook.io/yun-wei-bi-ji/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://close.gitbook.io/yun-wei-bi-ji/centos/vue/xiang-mu/1-11.-yin-ru-vuex-zhuang-tai-guan-li-yong-hu-xin-xi.md).
# 1 11.引入vuex状态管理用户信息
>
* #### 安装
```js
npm install vuex@next --save
```
* #### 管理用户信息
> 创建 store 文件夹： src/store/index.js
```js
import { createStore } from 'vuex'
// 创建一个新的 store 实例
const store = createStore({
state() {
return {
// 用户信息
user: {}
}
},
mutations: {
// 记录用户信息
SET_USERINFO(state, user) {
state.user = user
}
}
})
export default store
```
* ### 注册到入口文件
> main.js
```js
...略
import store from './store' // +
app.use(store) // +
```
* #### 修改 login.vue
> 登录获取用户信息，保存到 store 里
```js
...略
import { useStore } from 'vuex'
const store = useStore()
...略
// 测试携带 Toekn 访问自己个人信息
getinfo().then(res2=>{
store.commit("SET_USERINFO",res2) // +
console.log(res2)
})
```
* #### 测试渲染保存的信息
> index.vue
```js
后台首页
{{ $store.state.user }}
```
