VueJS - 使用 v-model 将数据（数组）从子组件传递到父组件答案

【问题标题】：VueJS - Pass data (array) from child to parent component with v-modelVueJS - 使用 v-model 将数据（数组）从子组件传递到父组件
【发布时间】：2019-06-20 14:44:21
【问题描述】：

我尝试使用 v-model 将数据（数组）从子组件发送到父组件，但是当父组件创建时，我的 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>

谢谢你，

【问题讨论】：

标签： javascript vue.js events

【解决方案1】：

改变一下

@phaselist:selected="onChangeChild"

到

@selected="onChangeChild"

父亲

【讨论】：