vuex,感觉就像是类似于内存(项目的全局变量)一样的东西,可以直接全局给其他地方的组件使用

1.安装(打开项目,cmd执行)



vue add vuex


2.目录结构(发现直接都已经有了store,主要是store里的index.js、main.js-这个已经默认安装好了、demo.vue页)

demo.vue



<template>
<h1>{{username}}</h1>
</template>


<script>
import {} from 'vuex'
export default{
name:'demo',
data(){
return{
msg:'这是个Demo'
}
},
computed:{
username(){
return this.$store.state.username
}
}
}
</script>

<style>
</style>


 

main.js



import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'

createApp(App).use(store).use(router).mount('#app')


 

 demo.vue



import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'

createApp(App).use(store).use(router).mount('#app')


 

运行显示结果:

vuex的简单使用_.net

 

 

 参考:https://www.bilibili.com/video/BV1UJ411c7Qe?p=27&spm_id_from=pageDriver