Question

我尝试使用v模型从子组件向父组件发射数据（数组），但是当父组件创建时，我的console.log无法正常工作。因为我是初学者，所以我不会使用Vuex。

这是我的child component，此组件有嵌套子级：

<template>
  <PhaseListItem
    v-model="selectedPhase"
    ...
  />
</template>

<script>
  import PhaseListItem from '@/components/phase/PhaseListItem'

  export default {
    name: 'PhaseList',

    components: {
      PhaseListItem
    },

    data () {
      return {
        data: ['item 1', 'item 2'],
        selectedPhase: undefined,
      }
    },

    watch: {
      selectedPhase () {
        this.$emit('phaselist:selected', this.data)
       }
    },
  }
</script>

这是我的parent child：

<template>
  <PhaseList
    @phaselist:selected="onChangeChild"
  />
</template>

<script>
  import PhaseList from '@/components/phase/PhaseList'

  export default {
    name: 'PhaseCreate',

    components: {
      PhaseList
    },

    methods: {
      onChangeChild (value) {
        console.log('emit', value) // I want to see my array from child component
      }
    },
  }
</script>

谢谢

Answer 1

只需更改

@phaselist:selected="onChangeChild"

到

@selected="onChangeChild"

在父亲上

VueJS-使用v模型将数据（数组）从子组件传递到父组件

1 个答案: