Skip to content

input 组件在H5、APP上,调用 doFocus 方法,手动聚焦 input 报错 #1039

Description

@MonGDCH

问题描述
input 组件在H5、APP上,调用 doFocus 方法,手动聚焦 input 报错。

TypeError: this.$refs.input-native.focus is not a function

复现步骤
复现该行为的步骤:

  1. 在input-A中,回车后,调用 input-B 的 doFocus

  2. 伪代码

<template root="uniUpRoot">
    <up-card :show-head="false" :show-footer="false" :border="false" margin="0" full>
        <template #body>
            <up-form labelPosition="left" labelWidth="80" labelAlign="left" :model="form" ref="formRef">
                <up-form-item label="仓位" prop="location">
                    <up-input v-model="form.location" @confirm="confirmLocation"></up-input>
                </up-form-item>
                <up-form-item label="数量" prop="qty">
                    <up-input ref="qtyInputRef" v-model="form.qty" type="number" placeholder="请输入数量"></up-input>
                </up-form-item>
            </up-form>
        </template>
    </up-card>
</template>
<script>
    import { ref, computed } from 'vue'
    import { test, http } from '@/uni_modules/uview-plus';
    export default {
        props: {},
        setup(prop) {
            const form = ref({ location: '', qty: 1 })
            // 产品输入框ref
            const qtyInputRef = ref(null)
            // 确认仓位
            const confirmLocation = () => {
                qtyInputRef.value.doFocus()
                // console.log(qtyInputRef.value)
            }

            return { form, confirmLocation }
        }
    }
</script>

预期行为
input-B 获取 focus

截图
Image

版本(请填写以下信息)
3.8.58

平台(请填写以下信息)

  • 平台:H5、Android

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions