子组件使用多个v-model

https://blog.csdn.net/Dobility/article/details/110147985

在这里插入图片描述

父组件使用
	<Test :value1.sync="value1" :value2.sync="value2" />
	
data(){
return (){
	value1: 1,
	value2: 2,
}
}
子组件Test.vue
<template>
	<!-- 预售销售选择内容:活动发货时间、最晚发货时间、已购会员店 -->
	<div class="Test">
		<div class="content-wrap">
			<div class="content">
				123456
				<input type="text" v-model="comValue1" />{{ comValue1 }} 
				<input type="text" v-model="comValue2" />{{ comValue2 }}
			</div>
		</div>
	</div>
</template>

<script>
export default {
	name: 'Test',
	components: {},
	filters: {},
	props: {
		preSaleActivityEndTime: '1',
		value1: '',
		value2: '',
	},
	data() {
		return {
			myValue: '',
		};
	},
	computed: {
		comValue1: {
			get() {
				return this.value1;
			},
			set(e) {
				this.$emit('update:value1', e);
			},
		},
		comValue2: {
			get() {
				return this.value2;
			},
			set(e) {
				this.$emit('update:value2', e);
			},
		},
	},
	watch: {},
	created() {},
	mounted() {},
	methods: {},
};
</script>
<style lang="scss" scoped></style>

posted @ 2021-09-23 21:01  Wayhome'  阅读(322)  评论(0编辑  收藏  举报
// 侧边栏目录 // https://blog-static.cnblogs.com/files/douzujun/marvin.nav.my1502.css