长春网站建设 吉网传媒,网站诚信体制建设,家族公司怎么注册,创意网需求1#xff1a;定义一个v-big指令#xff0c;和v-text功能类似#xff0c;但会把绑定的数值放大10倍。 需求2#xff1a;定义一个v-fbind指令#xff0c;和v-bind功能类似#xff0c;但可以让其所绑定的input元素默认获取焦点。 自定义指令函数式v-big#xff1a;
定义一个v-big指令和v-text功能类似但会把绑定的数值放大10倍。 需求2定义一个v-fbind指令和v-bind功能类似但可以让其所绑定的input元素默认获取焦点。 自定义指令函数式v-big
bodydiv idrooth2{{name}}/h2h2当前的n值是span v-textn/span/h2h2放大十倍后的n的值是span v-bign/span/h2button clickn点我n1/button/div
/bodyscriptnew Vue({el:#root,data:{name:木木,n:1,},directives:{//big指令何时被调用1.指令与元素成功绑定时一上来。2.指令所在的模板被重新解析时候。//参数element就是dom元素binding绑定的值的所有信息big(element,binding){console.log(element,binding)element.innerText binding.value*10}}})/script element: binding: 自定义指令对象式fbind
body!--需求1定义一个v-big指令和v-text功能类似但会把绑定的数值放大10倍。需求2定义一个v-fbind指令和v-bind功能类似但可以让其所绑定的input元素默认获取焦点。--div idrooth2{{name}}/h2h2当前的n值是span v-textn/span/h2h2放大十倍后的n的值是span v-bign/span/h2button clickn点我n1/buttonhr/input typetext v-fbind:valuen/div
/bodyscriptnew Vue({el:#root,data:{name:木木,n:1,},directives:{//big指令何时被调用1.指令与元素成功绑定时一上来。2.指令所在的模板被重新解析时候。//参数element就是dom元素binding绑定的值的所有信息//自定义的指令函数式big(element,binding){// console.log(element,binding)element.innerText binding.value*10},//自定义的指令对象式fbind:{//指令与元素成功绑定时一上来bind(element,binding){element.value binding.value},//指令所在元素被插入页面时调用inserted(element,binding){element.focus()},//指令所在的模板被重新解析时调用update(element,binding){element.value binding.value},}}})/script
效果 总结
