需求
点击列表组件跳转时带参,到新页面后取参,因为项目组件封装了多层,所以使用vuex比较方便
看代码
vuex的文件名
community.js //写vuex的文件
const state = () => ({
ProjectId:[],
})
const getters = {
}
const mutations = {
getProjectId(state,params){
state.ProjectId = params;
}
}
const actions = {}
export default {
namespace: true,
state,
getters,
mutations,
actions
}
组件里需要 传参 的页面的使用
html部分
<img slot="cover" src="https://os.alipayobjects.com/rmsportal/QBnOOoLaAfKPirc.png" @click="onClick(item)" />
js部分
<script>
methods: {
onClick(item) {
console.log("参数",item);
this.$emit('change','project-details'); //需要跳转的页面
this.$store.commit('public/community/getProjectId',item); //item为需要传的参数,是一个对象数组
}
}
</script>
组件里需要 取参 的页面的使用
html部分
<a-input v-model="getProjectId.projectName" disabled/>
<a-input v-model="getProjectId.projectProfile" disabled/>
js部分
<script>
computed: {
getProjectId(){
return this.$store.state.public.community.ProjectId
}
},
</script>
简单记录,请多指教