XhMultiInput.vue 1.01 KB
<!-- *******************  多个输入框  *******************  -->
<template>
	<view class="u-flex u-flex-wrap">
		<u-input class="input-item" v-for="(item,index) in inputOptions" v-model="item.value" @input="val=>{getValue(item)}" type="text" :key="index" :border="true" :placeholder="item.placeholder" />
	</view>
</template>

<script>
	import objMixin from './objMixin'
	export default {
		name: 'XhMultiInput',
		components: {},
		mixins: [objMixin],
		props: {},
		data() {
			return {}
		},
		computed: {
			inputOptions() {
				let options = this.item.inputOptions || []
				let result = options.map(item => {
					return {
						...item,
						value: ''
					}
				})
				return result
			}
		},
		watch: {},
		mounted() {},
		methods: {
			getValue(item){
				let currentValue = {}
				currentValue[item.fieldsName] = item.value
				// 以key,value的对象形式传递
				this.valueChange(currentValue)
			}
		}
	}
</script>

<style scoped>
	.input-item{
		width: 31%;  
		margin: 5rpx;
		background: #F4F5F7;
	}
</style>