Vue2中ref属性的用法

最近写东西遇到了莫名其妙的问题,用ref属性原以为它会获得一个数组

// html
      
  • 1
  •   
  • 2
// js
created: function() {
  this.$nextTick(() => {
    console.log(this.$refs.refCon) 
    // 打印结果:
  • 2
  • 本以为会获得一个数组    }) }

    后来去看了下文档才搞明白orz。(没仔细看文档的锅

    Vue2中ref属性的用法_第1张图片
    js01.png

    这下就明白了

    // html
    
    • {{item}}
    // js
    data: {
        people:['三姑','四婶','五叔','六姨','七舅姥爷']
    },
    created: function() {
        this.$nextTick(() => {
            console.log(this.$refs.refContent)
        })
    }
    
    Vue2中ref属性的用法_第2张图片
    js02.png

    以及一定要注意

    // js
    data: {
        people:['三姑','四婶','五叔','六姨','七舅姥爷']
    },
    created: function() {
        console.log(this.$refs.refContent)
        // undefined
    }
    

    你可能感兴趣的:(Vue2中ref属性的用法)