vue 自定义指令自动获取文本框焦点

作者: 吴小冷 | 来源:发表于2020-04-13 11:28 被阅读0次

Vue.js 学习笔记（二）
vue学习回顾第二天
vue常用特性应用场景
vue 自定义指令自动获取文本框焦点
vue input自动获取焦点以及自定义指令
vue中自定义组件、指令、插件
VUE02--{directive、filter、compute
Vue中高德地图的使用
season2-全局API
vue自定义指令

HTML：

<p><b v-show="show">{{tag}}</b><input v-focus v-model="tag" :hidden="show" type="text"></p>

js：

//官方例子
directives: {
      focus: {
        // 指令的定义
        inserted: function (el) {
          el.focus()
        }
      }
    }
//简化
directives: {
       focus:function (el) {
         el.focus();
       }
    }

如果在项目中使用官方的例子时，input不能自动获取焦点，使用简化时可自动获取焦点，查询相关资料后知道，insert是一个钩子函数，只要父节点存在，在插入父节点时调用，我这里并没有插入所以没有调用

Vue.js 学习笔记（二）
自定义指令示例，文本框自动获取焦点自定义全局指令使用 Vue.directive() 定义全局指令。和样式...
vue学习回顾第二天
自动获取焦点方式一：dom版方式二：通过自定义指令获取焦点自定义指令通过Vue.directive()创建，它...
vue常用特性应用场景
1 过滤器 Vue.filter 定义一个全局过滤器 2 自定义指令让表单自动获取焦点通过Vue.direc...
vue 自定义指令自动获取文本框焦点
HTML： js：如果在项目中使用官方的例子时，input不能自动获取焦点，使用简化时可自动获取焦点，查询相关资...
vue input自动获取焦点以及自定义指令
vue自动获取焦点首先得自己自定义一个指令。如：这样我们就新建了一个v-focus得指令。然后把指令添加到inp...
vue中自定义组件、指令、插件
组件全局组件局部组件自定义插件提供install方法，挂载到Vue 指令使用指令实现input自动获取焦...
VUE02--{directive、filter、compute
VUE 案例：input自动获取焦点 1. DOM操作（1）ref属性表示对dom的引用，ref值自定义，但不能...
Vue中高德地图的使用
介绍: 该地图包含功能有: 点击地图自动获取定位和经纬度到文本框文本框输入地址失去焦点后自动获得经纬度 1. ...
season2-全局API
第1节：Vue.directive 自定义指令 Vue.directive自定义指令自定义的指令：changec...
vue自定义指令
ue自定义指令自定义全局指定自定义可以让表单元素自动获取光标的元素使用自定义局部指令使用钩子函数对象...