zoukankan      html  css  js  c++  java
  • vue $ref的基本用法

    1、使用在一般的标签上

    <div id="app">
    <input ref="count" type="text" v-model="active.name" required name="name" value="">
    </div>

    这样在vue中我们可以使用$ref来获取dom节点,进行一些dom的操作

    下面示例:控制input输入框的文字个数

    new Vue({
        el:'#app',
        data:{
            active:{'name':''}
        },
        watch:{
            active:{
               handler:function(){
                    var _this = this;
                    var _sum = 4; //字数限制为4个
                    _this.$refs.count.setAttribute("maxlength",_sum);
               },
               deep:true
            }
        },
    })

    2、使用在子组件上,可以用来获取子组件的属性值,假设子组件里面都有一个属性news

    <div id="app">
        <hdnews ref="hdnews"></hdnews>
        <hdinfo ref="hdinfo"></hdinfo>
    </div>
    new Vue({
        el:'#app',
        mounted:function () {
            console.log(this.$refs.hdnews.news);
            console.log(this.$refs.hdinfo.news);
        }
    })

    转 :  https://blog.csdn.net/ljc20090913/article/details/81662690

  • 相关阅读:
    2018.5.5-6 GDCPC2018广东省赛 6/10 Rank12 Au
    网络流24题总结
    BZOJ4259 残缺的字符串 FFT
    [转]CodePlus 2018 3月赛 博弈论与概率统计
    Aiiage Camp Day6 J Sort
    Daily Scrum7
    Daily Scrum6
    Daily Scrum5
    Daily Scrum4
    Daily Scrum3
  • 原文地址:https://www.cnblogs.com/fps2tao/p/15780129.html
Copyright © 2011-2022 走看看