真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆

^{<sub id="0xb5q"></sub>}

重慶分公司

028-86922220

ref($refs)方法怎么在Vue.js中使用

這期內(nèi)容當(dāng)中小編將會(huì)給大家?guī)碛嘘P(guān)ref ($refs)方法怎么在Vue.js中使用，文章內(nèi)容豐富且以專業(yè)的角度為大家分析和敘述，閱讀完這篇文章希望大家可以有所收獲。

專注于為中小企業(yè)提供網(wǎng)站設(shè)計(jì)、做網(wǎng)站服務(wù),電腦端+手機(jī)端+微信端的三站合一,更高效的管理,為中小企業(yè)秀山土家族苗族免費(fèi)做網(wǎng)站提供優(yōu)質(zhì)的服務(wù)。我們立足成都，凝聚了一批互聯(lián)網(wǎng)行業(yè)人才，有力地推動(dòng)了上1000+企業(yè)的穩(wěn)健成長(zhǎng)，幫助中小企業(yè)通過網(wǎng)站建設(shè)實(shí)現(xiàn)規(guī)模擴(kuò)充和轉(zhuǎn)變。

一、ref使用在外面的組件上

HTML 部分


  
  
  ref在外面的組件上

js部分

  var refoutsidecomponentTem={
    template:"我是子組件

" }; var refoutsidecomponent=new Vue({ el:"#ref-outside-component", components:{ "component-father":refoutsidecomponentTem }, methods:{ consoleRef:function () { console.log(this); // #ref-outside-component vue實(shí)例 console.log(this.$refs.outsideComponentRef); // div.childComp vue實(shí)例 } } });

二、ref使用在外面的元素上

HTML部分



  
  
  ref在外面的元素上

JS部分

  var refoutsidedomTem={
    template:"我是子組件"
  };
  var refoutsidedom=new Vue({
    el:"#ref-outside-dom",
    components:{
      "component-father":refoutsidedomTem
    },
    methods:{
      consoleRef:function () {
        console.log(this); // #ref-outside-dom  vue實(shí)例
        console.log(this.$refs.outsideDomRef); //   ref在外面的元素上
      }
    }
  });

三、ref使用在里面的元素上---局部注冊(cè)組件

HTML部分



  
  
  ref在里面的元素上

JS部分

  var refinsidedomTem={
    template:"" +
            "我是子組件" +
         "",
    methods:{
      consoleRef:function () {
        console.log(this); // div.childComp  vue實(shí)例 
        console.log(this.$refs.insideDomRef); // 我是子組件
      }
    }
  };
  var refinsidedom=new Vue({
    el:"#ref-inside-dom",
    components:{
      "component-father":refinsidedomTem
    }
  });

四、ref使用在里面的元素上---全局注冊(cè)組件

HTML部分

JS部分

  Vue.component("ref-inside-dom-quanjv",{
    template:" " +
          "" +
          " ref在里面的元素上--全局注冊(cè)  " +
         "",
    methods:{
      showinsideDomRef:function () {
        console.log(this); //這里的this其實(shí)還是div.insideFather
        console.log(this.$refs.insideDomRefAll); // 
      }
    }
  });

  var refinsidedomall=new Vue({
    el:"#ref-inside-dom-all"
  });

上述就是小編為大家分享的ref ($refs)方法怎么在Vue.js中使用了，如果剛好有類似的疑惑，不妨參照上述分析進(jìn)行理解。如果想知道更多相關(guān)知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

文章標(biāo)題：ref($refs)方法怎么在Vue.js中使用
當(dāng)前地址：http://weahome.cn/article/piohci.html