TypeError:无法读取未定义的属性“ _wrapper”

时间:2019-11-04 15:46:50

标签: javascript vuejs2 vue-component vue-events

我正在尝试将通过单击按钮发送到组件的道具数据更新为vue中的单个组件。

单击按钮可触发操作,以从配置加载数据。但这会引发错误,并且错误消息不明确。在https://imgur.com/a/0psUWKr

中找到错误

如果我直接进行数据传递而没有按钮动作,则可以正常工作。

我的主要组件


<template>
  <div>
    <MyList v-if="listItems" :elements="listItems"/>
    <button @click="showSlider">Show Slider</button>
  </div>
</template>

<script>
// imports the components and config files

export default {
  name: "ListView",
  data() {
    return {
      listItems: []
    };
  },
  components: {
    MyList
  },
  methods: {
    showSlider: function() {
         this.listItems.push(configs['elements'])
    },
</script>

注意:如果我默认情况下将数据提供给listItems,则可以正常运行

还有MyList文件


<template>
  <ul>
    <li v-for="each in elements" :key="each.id">
      {{each.name}}
    </li>
  </ul>
<template>

<script>
// imports the components and config files

export default {
  name: "MyList",
  props: {
    elements: {
      type: Array
    }
  }
</script>

1 个答案:

答案 0 :(得分:0)

一般来说,它应该可以工作。但就我而言,问题在于以下功能中的push

 showSlider: function() {
     this.listItems.push(configs['elements'])
},

Vuex存储相同内容,并使用调度程序来更新相同内容,例如超级按钮。然后我使用计算属性从vueX加载状态并将其传递给 MyList