解决vue页面传值的问题

两个页面之间通过Vuex进行传值

store代码：
import Vue from 'vue'
import router from '@/router/routes'
import Layout from '@/modules/layout/Layout'
import NestRoute from '@/modules/layout/NestRoute'

const Types = {
  ADD_PAGE_DETAIL: 'ADD_PAGE_DETAIL',
  SET_SKIN: 'SET_SKIN'
}
const state = {
  // 皮肤版本
  skin: 'v1',
  chandData:{},//进行声明
}
const getters = {
  skin: state => state.skin
}
const mutations = {
  chandDatas(state,chandData){
    state.chandData=chandData//传值
  }
}
const actions = {
  chandDatas(ctx,chandData){
    ctx.commit('chandDatas',chandData)//提交
  }
}
export default {
  state,
  actions,
  mutations,
  getters
}

复制代码

需要传值的页面
import {  mapActions, mapState, mapGetters  } from 'vuex'
methods: {
    openDetails(row){
        this.$store.commit("chandDatas",row)//动态传值@@@
            this.addPageDetail({
                component: ruleDetail,
                name: `ruleDetail_${row.id}`,
                path: `/basedata/ruleDetail/${row.id}`,
                meta: {
                    id: row,
                    label: `${row.id}`,
                    parent: 'freight',
                    closable: true,
                    cache: false,
                },
                isActive:row.isActive
            }).then(() => {
                this.$router.push({ name: `ruleDetail_${row.id}` })
            })
            
              
          },
    }
复制代码

需要接收值页面
import {  mapActions, mapState, mapGetters  } from 'vuex'
 methods: {
    ...mapActions([
    ]),
    fetchDetail() {
        let data2=this.$store.state.common.chandData;//接收值
    },
  },
复制代码

转载于:https://juejin.im/post/5c89e194e51d4556897da817