vue3父组件调用vue2子组件传参数
1. vue3父组件
javascript
<template>
<div>
<child :message="message" />
<button @click="test">添加车牌号</button>
</div>
</template>
<script setup>
import { ref, onMounted } from 'vue';
import Child from './Child.vue'; // 确保路径正确
const id = ref(0);
const message = ref('');
const test = () => {
id.value = 1;
message.value = "皮卡";
};
</script>
2. vue2子组件`
javascript
<template>
<div>{{ message }}</div>
</template>
<script>
export default {
props: ['id','message'],
data() {
return {
message: ''
}
},
mounted() {
this.message = this.$props.message;
}
}
</script>