[JavaScript] VUEX的store用法

• 进入以个文件夹：cd vuewebpackapp
  
• 初始化这个项目：vue init webpack vuexapp
  
• 一系列的选择确认后
  
• 就会创建好文件
  

• 在components新建parent.vue（父组件）和一个son.vue子组件；
  
• 在父组件内引入子组件​​import son from './son'​​,并传msg给子组件
  

• 子组件如何接收父组件传递的内容：
  

• helloworld.vue
  

• 父组件从子组件接收数据，如何设置
  

• 子组件向父组件传递数据
  
• 
  
  
  
  • 在子组件设置按钮
    
  
  

• 在父组件里接收
  

• 渲染在页面上
  

• 用来管理状态，共享数据，在各个组件之间管理外部状态，如何使用？
  
• 
  
  
  
  • 第一步：引入vuex，通过use方法使用它；
    
  • 第二步：创建状态仓库；
    
  • 第三步：通过this.$store.state.xxx直接拿到需要的数据
    
  
  

//创建状态仓库var store = new Vuex.Store({  state:{  XXX:xxx  }})//直接通过this.$store.xxx拿到全局状态复制代码

• outter文件和parent和son文件，没有父子关系，但是又想让他们之间共享数据，就用到vuex文件；
  
• 在终端安装：npm i vuex
  
• 在main.js中引入Vuex：import Vuex from 'vuex'
  
• 接着在main.js中use一下：Vue.use(Vuex)
  
• 创建状态仓库
  

• 在son.vue文件中如何获取文件？
  

• 在父组件中的代码与子组件类似，只是getNum换成getCount
  
• 在outter中 也是一样