父组件
<SelectTime v-model="currentYear" v-model:currentMonth="currentMonth" ></SelectTime>
<script lang="ts" setup>
const currentYear = ref('1990');
const currentMonth = ref('01');
</script>
子组件(setup语法糖)
<template>
<div>
{{ props.modelValue }} - {{ props.currentMonth }}
<button @click="change">change</button>
</div>
</template>
<script setup>
const props = defineProps(['modelValue','currentMonth']);
const emit = defineEmits(['update:modelValue']);
const change = function(){
emit('update:modelValue','2024');
emit('update:currentMonth','03');
}
</script>
子组件(常规)
<template>
<div>
{{ modelValue }} - {{ currentMonth }}
<button @click="change">change</button>
</div>
</template>
<script>
import { defineComponent, ref, watch } from 'vue'
export default defineComponent({
props: ['modelValue','currentMonth'],
setup(props, { emit }) {
const change = function () {
emit('update:modelValue', '2024');
emit('update:currentMonth', '03');
}
return {
change
};
},
});
</script>