uniapp微信小程序开发过程中，用户觉得输入框点击范围太小，需要增加范围，为了不影响布局，前端使用其他方法来实现。
通过focus来控制输入框的激活

<template>
	<div class="item" @click="focusInput">
		<div class="itemTitle">{{ title }}</div>
		<div class="itemBody">
			<input ref="inputField" :type="type" v-model="inputValue" :placeholder="placeholder" :maxlength="maxlength"
				@blur="blurInput"  :focus="Focus">
		</div>
	</div>
</template>

<script>
	export default {
		props: {
			value: [String, Number],
			title: String,
			type: {
				type: String,
				default: 'text'
			},
			placeholder: {
				type: String,
				default: '请输入'
			},
			maxlength: {
				type: Number,
				default: 100
			}
		},
		data() {
			return {
				Focus: false
			};
		},
		computed: {
			inputValue: {
				get() {
					return this.value;
				},
				set(val) {
					this.$emit('update:value', val);
				}
			}
		},
		methods: {
			focusInput() {
				this.Focus = true
			},
			blurInput() {
				this.Focus = false;
			}
		}
	}
</script>

<style scoped>
	.item {
		margin-bottom: 20px;
	}

	.itemTitle {
		font-weight: bold;
	}

	.itemBody {
		margin-top: 10px;
	}
</style>

使用

<FormItem v-model:value="data.details" title="详细地址" type="text" placeholder="请输入" maxlength="100"></FormItem>