关于list组件点击到info组件详情中报错 state is not defined,如果删去store.commit(),不报错但又显示全部列表内容

来源:5-1 重点知识点回顾

淡水狗

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: {


},

});



写回答 关注

1回答

  • 慕标1446865
    2019-05-07 10:02:22
    已采纳

    我觉得是你store.js里面,detail方法没有接受 state 作为第一个参数:

    detail(state,index){

          state.number = index

    }

    vuex-mutations你可以看一下文档


    淡水狗

    谢谢,是的。是漏了这个参数。已经解决

    2019-05-07 10:03:35

    共 1 条回复 >

3小时速成 Vue2.x 核心技术

带你快速学习最流行的前端框架vue2.x的核心技术

82559 学习 · 487 问题

查看课程

相似问题