哈爾濱市某某建築工程教育中心
    • 网站首页
    • 公司简介
      公司简介
      企业文化
    • 产品展示
      汽車電瓶
      汽車音響
      汽車配件
    • 新闻动态
      公司新闻
      行业新闻
    • 成功案例
      成功案例
    • 客户服务
      售后服务
      技术支持
    • 人才招聘
    • 联系我们
      联系我们
      在线留言

    新闻动态Site navigation

    公司新闻
    行业新闻

    联系方式Contact


    地 址:聯係地址聯係地址聯係地址
    电 话:020-123456789
    网址:www.6ql2.cn
    邮 箱:[email protected]

    网站首页 > 新闻动态
    新闻动态Welcome to visit our

    【】指令都是启动e启以 v-xxx 命令

    分享到:
      来源:哈爾濱市某某建築工程教育中心  更新时间:2026-10-07 20:35:34  【打印此页】  【关闭】

    在Vue中 ,启动e启指令都是命令以 v-xxx 命令 ,因此自定義指令也是动命如此自定義指令時 ,指令名稱不需要加前綴v-,令墙裂推但在調用的時候一定要加前綴v-自定義一個

    啟動命令(vue啟動命令)牆裂推薦

     

    在Vue中 ,指令都是启动e启以 v-xxx 命令 ,因此自定義指令也是命令如此自定義指令時 ,指令名稱不需要加前綴v-,动命但在調用的時候一定要加前綴v-自定義一個獲取焦點的指令 v-focus//定義一個全局的指令(directive :指令)

    //參數1為指令名稱,定義的令墙裂推時候 ,不需要加 v-  ,启动e启調用時需要v- ,命令//參數2是對象,對象中有指令相關函數,动命在特定時候運行,令墙裂推 Vue.directive(focus,启动e启{ //獲取當前指令(v-focus)綁定的元素e ,e.focus()方法在綁定元素插入到DOM中時調用

    inserted:function(e){ e.focus() } }) //等同於js中: var e = document.getElementById("e")// e.focus()

    //局部指令定義,命令vm實例中directives:{ focus:{ inserted:function(e){ e.focus() } } }鉤子函數:

    bind:隻調用一次,第一次綁到到元素時調用 ,动命一般用在初始化中,在inserted之前  ,此時父節點為null,在dom樹繪製之前調用,一般用作初始化屬性(樣式 、元素屬性)的設置,綁定後屬性就已經在當前元素中了。

    inserted:被綁定元素插入到父節點時調用,父節點存在即可,隻調用一次,在dom樹繪製之後調用 ,一般用作初始化方法(js的行為方法)的設置 ,綁定到DOM中後立即執行一次updated:所在的組件更新時調用,在 。

    componentUpdated之前調用 ,更新前的狀態 ,多次調用componentUpdated:所在的組件及及子元素全部更新時調用,更新後的狀態,多次調用unbind:隻調用一次 ,指令與元素解綁時調用

    Vue.directive(指令名稱,{ //指令綁定到元素上的時候會立即執行,一般用作初始化 ,隻執行一次 ,當指令剛被綁定到元素的時候,還沒有插入到DOM樹中去//綁定時不管有沒有插入到DOM中 ,已經有了value="" 和 style="color:red"的屬性

    //bind因此可以做一些初始化屬性的設置bind:function (e) { e.value = "文本框初始值" e.style.color =

    red }, inserted:function (e) { //元素插入到DOM樹中後會立即執行一次,可作初始化方法的設置 e.focus() },

    updated:function (e) { //vnode更新的時候會執行,可觸發多次 }, componentUpdated

    :function (e) { }, unbind:function (e) { } })

    "text" v-focus>鉤子函數參數:el:指令被綁定的當前元素 ,即當前指令所在的元素,此參數名可以變更,其他參數名不能變更binding:name:指令名  ,不包括v-前綴value:指令綁定值 ,v-color=" blue ","1+1"為2

    oldValue:指令綁定的前一個值expression:指令綁定值的字符串形式"1+1"就是"1+1"而不是2arg:傳遞給指令的參數v-color:bluemodifiers:包含修飾符對象 v-mydirective.foo.bar

    modifiers為{ foo.true,bar,true}3.vnode:vue編譯器生成的虛擬節點4.oldVnode:上一個虛擬節點Vue.directive("color",{ bind:

    function(e,binding) { e.style.color = binding.value e.style.color = binding.

    arg } }) //注意單引號,否則blue為data中數據

    type="text" v-focus v-color:blue>自定義指令的簡寫如果隻有bind或updated鉤子函數,則可以簡寫Vue.directive("color", (e,binding) => { e.style.color = binding.value e.style.color = binding.

    arg }) //注意單引號,否則blue為data中數據 <

    inputtype="text" v-focus v-color:blue>

    免責聲明:本站所有信息均搜集自互聯網 ,並不代表本站觀點,本站不對其真實合法性負責 。如有信息侵犯了您的權益 ,請告知 ,本站將立刻處理。聯係QQ:1640731186

    上一篇:業績“翻盤”卻再遭謠言 雅芳做了這些事
    下一篇:幻彩花色推薦丨2024年流行的“複古暖色調” ,快來抄作業

    相关文章

    • Vison China2024
    • 電腦桌麵壁紙台式電腦組裝機清單
    • 筆記本電腦十大排行榜高配台式電腦配置單
    • 聯想筆記本電腦哪款好中關村電腦排行榜
    • 香港澳美製藥企業義工隊榮獲“義工團體年度嘉許”銅狀
    • 中關村電腦網電腦沒有聲音一鍵修複
    • 新手學電腦開機怎麽開平板電腦排名前十名性價比最好的台式電腦
    • 電腦組裝配置單及價格一體機電腦屏幕不亮
    • 被207家零售大咖瘋狂搶簽的超級品牌,閩派新黑馬佐米熊逆市崛起
    • 月靈傳奇變態版電腦版哪種電腦筆記本比較好

    友情链接:

      一樓一new161樓上骨討論區樓上骨
    公司简介|产品展示|新闻动态|成功案例|客户服务|人才招聘|联系我们

    Copyright © 2026 Powered by 哈爾濱市某某建築工程教育中心   sitemap

    0.211s , 7184.984375 kb