Question

我需要将子数据传递给父组件。代码很简单，但我无法理解我遗失的内容和位置。

export default {
  name: 'TableOfContent',
  props: ['itemGUID'], // is it nessosary? 
  methods: {
      itemClick(itemGUID)
      {
        console.log(itemGUID);
        this.$emit('newchapter', itemGUID) // passing GUID to parent
      }
  }
}

父模板：

<template>
    <div class="Book" v-on:newchapter="foo(itemGUID)">
        {{msg}}
    </div>
</template>


<script>
import toc from './TableOfContent.vue'

export default {
  name: 'mybook',
  data () {
    return {
      msg: 'my main book'
    }
  },
  methods:
  {
      foo(itemGUID)
      {
          console.log("GUID is: ", itemGUID);
      }
  },

   components: {toc}

}
</script>

此代码不起作用：（

Answer 1

只需在模板中执行以下操作：

<template>
    <div class="Book" v-on:newchapter="foo">
        {{msg}}
    </div>
</template>

无法使用emit将子数据传递给父组件

1 个答案: