uni-app_input_焦点手动获取

uni-app input 焦点手动获取

<template>
    <view>
        <!-- 
			@blur="focusState = false" 失去焦点时需要把状态设置成 false，
			不然状态为 true 将无法通过设置 true 重新获取焦点 
		-->
        <input v-model="value" :focus="focusState" @blur="focusState = false" />
        <button @click="inputFocus">Focus</button>
    </view>
</template>
<script lang="ts">
import { defineComponent, reactive } from '@vue/composition-api'

export default defineComponent({
    methods: {
        inputFocus() {
            // 需要使用 this.$nextTick/setTimeout 进行赋值
            this.$nextTick(() => {
                this.focusState = true
            })
        }
    },
    setup() {
        return reactive({
            value: '',
            focusState: true // 默认获取焦点
        })
    },
})
</script>