强制转换成数值型(原本文本框是字符串) v-model.number
去掉空格 v-model.trim 转变为change事件 失去焦点才改变值 v-model.lazy 自定义指令 directive <div id="app"> <input type="text" v-focus> //使用自定义指令必须加v- ,这个绑定的input就执行里面的函数 <input type="text"> </div> Vue.directive('focus', { inserted: function (el) { el.focus(); } }); 带参数的自定义指令 Vue.directive("color", { bind: function (el, binding) { console.log(binding.value.color); //blue console.log(binding.value); //返回 Object 里面包含color console.log(binding.value.name); //undefind el.style.backgroundColor = binding.value.color; }}); Vue.directive('red',{ bind:function(el,binding){ console.log(binding.value.red) el.style.backgroundColor=binding.value.red; } }); bind 和 inserted 共同点: dom插入都会调用,bind在inserted之前 不同点: bind 时父节点为 null inserted 时父节点存在。 bind是在dom树绘制前调用,inserted在dom树绘制后调用 bind: function (el) { console.log(el.parentNode) // null console.log('bind') }, inserted: function (el) { console.log(el.parentNode) // <div class="directive-box">...</div> console.log('inserted') }相关文章
- 03-11Firefox常用插件
- 03-11python 常用的字符串方法
- 03-11前端mv框架下(目前写的是vue),对组件抽象的思考
- 03-11Docker(1-3) Docker 常用命令
- 03-11HDFS常用文件操作
- 03-11Docker中部署前后端分离项目(vue+springboot)(一)
- 03-11easy-x常用函数
- 03-11VueEasySlider - 基于 Vue.js 的简洁开源轮播图组件
- 03-11QT常用模块
- 03-11vue请求url出乱码:[object%20PointerEvent] ,PointerEvent {isTrusted: true, pointerId: 1, width: 1, height: