Uniapp 自动获取焦点的 Input 输入框组件封装

<template>
  <div>
    <input :placeholder='placeholder' :value='value' @input='onInput' @blur='onBlur' ref='input'>
  </div>
</template>
<script>
export default {
  props: {
    placeholder: {
      type: String,
      default: ''
    },
    value: {
      type: String,
      default: ''
    }
  },
  methods: {
    onInput(e) {
      this.$emit('input', e.target.value)
    },
    onBlur() {
      setTimeout(() => {
        this.$refs.input.focus()
      }, 100)
    }
  }
}
</script>
<p>该组件包含一个 input 输入框，当失去焦点时，组件通过 setTimeout 延迟 100 毫秒后自动获取焦点，从而实现了失去焦点后自动获取焦点的效果。使用时，可以通过属性绑定传入 placeholder 和 value，同时监听 input 事件和 blur 事件实现数据的双向绑定和自动获取焦点。</p>