input自动获取焦点弹出键盘

最新推荐文章于 2023-11-22 16:50:35 发布

陌~上花开

最新推荐文章于 2023-11-22 16:50:35 发布

阅读量2.7k

点赞数 2

分类专栏： uni-app

原文链接：https://www.cnblogs.com/landuo629/p/13939709.html

版权

uni-app 专栏收录该内容

15 篇文章 8 订阅

订阅专栏

本文介绍了如何在Vue中实现一个搜索框，通过设置`firstFocus`属性并利用`setTimeout`实现输入框的自动获取焦点。核心在于`firstChange`方法的运用，确保每次搜索时清空focus状态并随后恢复焦点。

摘要由CSDN通过智能技术生成

原文链接

<template>
	<view>
		<input type="search"  placeholder="搜索商品"  placeholder-style="color:#adaeba;" :focus="firstFocus" @change='firstChange'/>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				firstFocus:false 
			}
		},
		onShow() {
		    //调用fisrtChange
			this.firstChange()
		},
		methods: {
			firstChange() {
				this.firstFocus = false; // 每次都要初始化 focus 属性
				setTimeout(() => {
					this.firstFocus = true; //自动获取焦点
				},0)
			}
		}
	}
</script>