vue3父子组件传值
## index.vue
<template>
我是父组件
<p>{{ str}}</p>
</template>
<script setup>
import Child from "./";
import { ref } from "vue";
const str= ref(""); // 从子组件传出的值
// 组件的自定义事件
const childChange = (val) => {
str.value = val;
};
</script>
-----------------------------------分割线---------------------------------------------------
## Child.vue
<template>
我是子组件
<el-button @click="handleClick">点我触发自定义事件</el-button>
</template>
<script setup>
// 使用 defineEmits 声明 emits
const emit = defineEmits(["change"]);
const handleClick = () => {
// 必须经过defineEmits声明,不然方法无效!
emit("change", "我是经自定义方法传出的值");
};
});
</script>