淡水狗
2019-04-29 18:04
List.vue
<template>
<div>
<ul>
<li v-for="(item, index) in pageLists"
:key = "index"
@click="more(index)"
>
{{index}} - {{ item.title }} - {{ item.content }}
</li>
</ul>
</div>
</template>
<script>
import store from '@/store'
export default {
name:'list',
store,
methods: {
more(index){
store.commit('detail', index)
this.$router.push('/info')
}
},
computed: {
pageLists(){
return store.state.lists
}
},
}
</script>
<style scoped>
</style
Info.vue
<template>
<div>
<div v-for="(item, index) in pageLists"
:key="index"
v-show="index == current">
<span>{{item.title }}</span>
<p>{{ item.content }}</p>
</div>
</div>
</template>
<script>
import store from '@/store'
export default {
name:'info',
store,
data(){
return {
}
},
computed:{
pageLists(){
return store.state.lists
},
current(){
return store.state.number
}
}
}
</script>
<style scoped>
</style>
store.js
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex)
export default new Vuex.Store({
state: {
lists:[],
number:null
},
mutations: {
addList(state, value){
state.lists.push(value)
},
detail(index){
state.number = index
}
},
actions: {
},
});
我觉得是你store.js里面,detail方法没有接受 state 作为第一个参数:
detail(state,index){
state.number = index
}
vuex-mutations你可以看一下文档
3小时速成 Vue2.x 核心技术
82574 学习 · 489 问题
相似问题