vuex示例

State

//main.js
import Vue from 'vue'
import App from './App.vue'
import Vuex from 'vuex'

Vue.use( Vuex )

const store = new Vuex.Store({
  state:{ 
    products: [
      {name: '鼠标', price: 20},
      {name: '键盘', price: 40},
      {name: '耳机', price: 60},
      {name: '显示屏', price: 80}
    ]
  }
})

new Vue({
  el: '#app',
  store,
  render: h => h(App)
})

 

ProductListOne.vue         

export default {
    data () {
        return {
            products : this.$store.state.products //获取store中state的数据
        }
    }
}

 

ProductListTwo.vue 　

export default {
    data () {
        return {
            products: this.$store.state.products //获取store中state的数据
        }
    }
}