TypeError: Cannot read property '_wrapper' of undefined

TypeError: Cannot read property '_wrapper' of undefined

我正在尝试将单击按钮时发送到组件的道具数据更新到 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>

总的来说应该可以。但就我而言,问题出在以下函数中的 push

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

Vuex 存储相同的内容并使用调度程序更新相同的内容非常有效。我使用计算 属性 从 vueX 加载状态并将其传递给 MyList