vuex 兄弟传值 方式

兄弟传值 需要安装

npm install --save pubsub-js

父页面

 main.js

import Vue from 'vue'
import App from './App.vue'
import store from './store'
 
Vue.config.productionTip = false
 
new Vue({
    store,
    render: h=>h(app)
}).$mount('#app')

store.js

import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

export default new Vuex.Store({
  state: {
    // 存储数据
    list: "",
  },
  mutations: {
    // 数据从新赋值 给value
    saveData(state, value) {
      state.list = value;
    }
  },
  actions: {
    // 触发数据方法
    save(context, value) {
      context.commit("saveData", value);
    }
  }
})

一个数据传值演示

兄弟页面一

兄弟页面二

多个值演示  store.js  main.js  父页面 都参考上边

 兄弟页面一

兄弟页面二

 

参考

Vue中组件的五种传值方式_vue兄弟组件传值的五种方法_xdlhw1997的博客-CSDN博客