1.components
<template>
<!-- 行内样式 -->
<button @click="$emit('change',Math.random())"></button>
<!-- 名称 -->
<button @click="onclick"></button>
<input type="text" @input="onchange" />
</template>
<script setup>
import {
ref
} from 'vue';
const emit = defineEmits(['add']);
function onclick() {
emit('add', 123);
}
function onchange(e) {
emit('onchange', e.detail.value)
}
</script>
<style lang="scss">
</style>
2.pages
用 e 来接受子组件传过来的数据
<template>
<view @add="onclick" @onchange="onchange">{{num}}</view>
</template>
<script setup>
import {
ref
} from "vue";
const num = ref(0);
const num1 = ref(0)
function onclick(e) {
console.log(e);
num.value = e;
}
function onchange(e) {
console.log(e);
num1.value = e;
}
</script>
<style>
</style>