uniapp input输入框 在APP端 拿不到的问题

uniapp的input双向绑定在APP端拿不到值的问题

在uniapp 使用 input 的 v-model进行数据绑定  在输入法没确定时候  input框显示有值  但是动态绑定的变量是获取不到相对应的值,而这个时候你如果想要提交数据什么的,会发现一直是个空

在上图这个情况下  用户没选择对应英文  直接按保存的话  会发现一直拿不到数据  但页面又显示出数据(存在于部分手机和iOS)

解决这个问题的方法就是  在 保存的 方法触发 加上一个定时器和失去焦点

1.第一步在input动态设置fcous属性

2. 点击保存的时候 去掉焦点  添加定时器

完整的代码 由于里面有我自己封装的组件 所以不可以直接用template的组件  只需要拿input出来就可以

<template>
	<view class="content">
		<c-label label="input输入的值">
			<text>{
   
   {val}}</text>
		</c-label>
		<c-label label="input">
			<input type="text" value="" v-model="val" :focus="isFocus"  placeholder="请输入"/>
		</c-label>
		<view class="m30">
			<c-button type="default" round="" @click="save">确定</c-button>
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				val : '',
				isFocus : false,
				timer : null,
				
			};
		},
		async onLoad() {
			
		},
		methods: {
			save(){
				/* 取消焦点 */
				this.isFocus = false;
				/* 添加定时器 */
				clearTimeout(this.timer);
				this.timer = setTimeout(()=>{
					// 逻辑操作
				},300)
				
			}
		},
		async onShow() {
			const that = this;
			/* 登录操作处理 */
			// this.$store.dispatch('login/checkLogin')
		},
		async onReady() {
		}
	};
</script>


<style lang="scss">
</style>

猜你喜欢

转载自blog.csdn.net/qq_37564189/article/details/115023548