博客

vue3:emit传参 【案例 – 修改昵称】

  • Post author:
  • Post category:vue




图示：

在这里插入图片描述



父子传参

子组件

Child.vue 

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

父组件

father.vue 

<template>
  <div>
    <child @my-emit="parentEmit"></child>
  </div>
</template>

<script>
import Child from "./Child.vue";
import {
    ref } from "vue"


版权声明：本文为weixin_45044349原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。