VUE如何用父组件的点击动作,触发子组件中的动作

这个是父组件

<template>
  <div id="Parent">
    <button v-on:click="parentClick">Parent Click</button>
    <ul>
      <location v-for="child in children">
      </location>
    </ul>
  </div>
</template>

<script>
  import child from './Child.vue'
  
  export default {
    components: {
      child
    },
    methods: {
      deployAll () {
        console.log('Parent Click')
        this.$emit('parentClick')
      }
    },
    computed: {
      children () {
        return [
          {
            id: '1',
            name: 'Beijing',
          },
          {
            id: '2',
            name: 'Xiamen',
          }
        ]
      }
    }
  }
</script>

子组件:

<template>
  <li>
    <button v-on:parentClick="childClick">Child Click</button>
  </li>
</template>

<script>
  export default {
    methods: {
      childClick () {
        console.log('Child Click ')
      }
    },
    props: ['child']
  }
</script>

我想让父组件中的Parent Click触发子组件中的Child Click按钮,或者子组件中的childClick方法也可以。不知道该如何处理

阅读 5.4k
1 个回答
推荐问题