Use vuex state of - VUE

1, the installation

Into the project directory, execute the command vue add vuex

 

2, will add store folder under the src directory

 

3, open index.js store folder, to state some of the data set

Import view from 'View'
import Vuex from 'vuex'

Vue.use(Vuex)

export default new Vuex.Store({
  state: {
     count:0,
    everybody:[
      {id:'1', title:'todoItem1',completed:false},
      {id:'2', title:'todoItem2',completed:false},
      {id:'3', title:'todoItem3',completed:false},
      {id:'4', title:'todoItem4',completed:false},
      {id:'5', title:'todoItem5',completed:false}
    ]
  },
  getters:{

  },
  mutations: {
  },
  actions: {
  },
  modules: {
  }
})

 4, App.vue to obtain these data

<template>
  <div id="app">
    <P> {{ COUNT }} </ P> <-!  COUNT is computed method registered name   ->
    <p> {{todos}} </p>
  </div>
</template>

<script>

export default {
  name: 'app',
   computed: {
    count(){
      return  the this. $ store.state.count    // get the store count in the state
    },
    everybody(){
      return this.$store.state.todos
    }
  },
}
</script>

Guess you like

Origin www.cnblogs.com/500m/p/11785109.html