vue3使用emit传参

阅读 103

2021-09-23

1. 父子传值

子组件 Child.vue
<template>
  <div>
    <button @click="childEmit">父组件传参</button>
  </div>
</template>
<script>
export default {
    setup(props,{emit}){  
        function childEmit () {
            emit('my-emit', '我是子组件值')
        }
        return{
            childEmit
        }
    }
};
</script> 
父组件 
<template>
  <div>
    <child @my-emit="parentEmit"></child>
  </div>
</template>

<script>
import Child from "./Child.vue";
import { ref } from "vue";
export default {
  components: {
    Child,
  },
  setup() {
    function parentEmit(val){
        // val
    }
    return{
        parentEmit
    }
  },
};
</script> 

精彩评论(0)

0 0 举报