首页 > 其他分享 >VUE2 完整写法

VUE2 完整写法

时间:2023-02-28 18:34:42浏览次数:39  
标签:console log binding window value element 完整 VUE2 写法

自定义指令的生命周期钩子 bind()、inserted()、updata()

<input type="text" v-fbind:value="n" />
<script>
    directives:{
        fbind:{            
            //指令与元素成功绑定时(即一开始)            
            bind(element, binding){                
                element.value = binding.value                
                //console.log(this)//这里的this是window
            },            
            //指令所在元素被插入页面时            
            inserted(element, binding{                
                element.focus()                
                //console.log(this)//这里的this是window            
            },            
            //指令所在的模板被重新解析时            
            update(element, binding){                
                element.value = binding.value                
                //console.log(this)//这里的this是window            
            }        
        }    
    }
</script>

标签:console,log,binding,window,value,element,完整,VUE2,写法
From: https://www.cnblogs.com/DTCLOUD/p/17165551.html

相关文章

  • vue2 模拟响应式数组优化2
    上一篇主要是对数组类型进行响应式处理,这次主要对数组里面的属性值、嵌套数组、数组新增后的值进行响应式处理。如下文:执行下面方法,数组的依赖函数不会触发import{obs......
  • vue双向绑定和双向修改写法总结
    2.x双向绑定//使用value和input老式写法<ChildComponentv-model="pageTitle"/>//是以下的简写<ChildComponent:value="pageTitle"@input="pageTitle=$event"/......
  • VUE2 自定义指令
    简写方式(有弊端)<h2>{{name}}</h2><h2>当前的n值是:{{n}}</h2><h2v-big="n">放大10倍后的n值是:{{n}}</h2><button@click="n++"></button>data(){return{......
  • vue2响应式原理
    首先要知道vue2是2013年基于ES5开发出来的 我们常说的重渲染就是重新运行render函数vue2响应式原理简单来说就是vue官网上的这图片  通过Object.defineProper......
  • VUE2 键盘事件
    常规用法<inputtype="text"@keyup="showInfo"></input>methods:{showInfo(e){console.log(e.target.value)//这种情况会是输入框中实时输入什么,就......
  • VUE2 滚动事件
    滚动条的滚动事件<ul@scroll="gundong"><li>1</li><li>2</li><li>3</li></ul>鼠标滚轮的滚动事件<ul@wheel="gundong"><li>1</li><li>2<......
  • 28、完整的模型验证步骤
    利用已经训练好的模型,给它提供输入1'''完整模型的验证'''2importtorch3importtorchvision4fromPILimportImage5fromtorchimportnn67'''1、......
  • Vue2路由跳转传参,获取路由参数,Vue监听路由
    1this.$router.push({2//name:路由组件名3name:routeName,4query:{5mapId:this.mapId6}7})89this.$router.push({1......
  • Vue2之v-model双向绑定原理
    一、简介v-model实现双向绑定的语法糖,常用于表单与组件之间的数据双向绑定.二、表单实现双向绑定1.原理分两步骤v-bind绑定一个value属性v-on指令给当前元素绑定inp......
  • 25、完整模型训练套路-----torch.train()-----torch.eval()
    1、在训练、测试步骤开始的时候   并不是一定要设置训练或者测试模式才能开始训练,如果网络模型中有特殊的层可以调用,但是如果没有,调用也不会出错的。   ......