• Vue Elementui 如何让输入框每次自动聚焦


    在项目优化中碰到一个小问题,在每次提示框显示的时候让提示框中的输入框聚焦。如下图。一般情况下提示框是隐藏的。点击了编辑才会弹出。

    那么原生属性autofocus 只在模板加载完成时起作用,也就是说只有第一次有用。

    然后尝试了ref,再this.$refs.el 也不能成功拿到该元素,因为饿了么组件封装的<el-input>对应的是外面一个div,里面包了个input,在获取元素的时候有问题的。

    第二种尝试,利用class 或者id 获取元素,然后再手动聚焦 el.focus(),好像也不起作用。

    然后查看文档决定用,diretives 自定义指令,然而还是怎么弄都没用。

    最后又是网上各种查,才明白,inserted 只在元素插入的时候才有用,然而饿了么组件中提示框的隐藏显示是v-show原来。

    没办法最后只能把<el-input> 替换掉,换成原生标签 input ,样式上直接class复制一下之前的样式吧。 v-if 与提示框的 v-show的值绑定在一起,这样就轻松实现啦!

    总结反思,对vue的自定义指令原理不熟悉 ,对饿了么组件的封装原理也不是十分明白。

    总觉得还有更简单的方法,希望大佬们多指教!!!

  • 相关阅读:
    简单实用游标更改数据
    C# Http以文件的形式上传文件
    简单例子理解数据库事务
    安卓 隐藏按钮
    jQuery EasyUI API 中文文档
    Linux搭建Tomcat环境
    linux教程之一
    Android服务之PackageManagerService启动源码分析
    DSP、Media、AdExchanger之间的关系及交互流程
    Unity3D中的Coroutine具体解释
  • 原文地址:https://www.cnblogs.com/hjj2ldq/p/7831972.html
Copyright © 2020-2023  润新知