【收藏】Vue+elementUI的this.$refs.对象名.方法名的理解

以前根本看不懂这么写是什么意思：

this.$refs.tree.getCheckedKeys());

其实上面的方法就是已经封装好的，直接调用即可，this,代表在当前vue里，$refs代表一个引用（可以把它近似看成一个包名，）然后tree就是我们的el-tree的ref,可以理解为是该控件的一个对象，然后我们可以通过对象调用方法。但是如果按照案例一那样写就不对了
即：

         <el-tree

                  ref="tree"
                  :data="treeList"
                  :props="defaultProps"
                  @node-click="handleNodeClick"
                  @getCheckedKeys()="function"
                  show-checkbox=true
                  node-key="id"
                >
        </el-tree>

上面这样写其实本质上就是我们自己定义的一个方法，覆盖掉了，原先elementUI帮我们封装好的方法，我们调用的时候就是我们自己的了，我们可以根据我们所需要的自定义实现该方法。如果要想调用原生态的方法就用this.$refs.tree.getCheckedKeys());
这种方式。但是也不见得所有的事件都有原生态的方法，比如有些事件只是定义了一个接口，具体的实现还得我们自己来，比如我们的button点击事件，我们的自己实现想要的功能，因为需求是不同的。如果你只写成这样this.$refs.tree.getCheckedKeys());那我也没有试过会怎么样，会调用什么方法。总之可能你调用了一个方法，但是你没有任何的实现，那这就没有任何的意义了。
 

https://blog.csdn.net/java_xxxx/article/details/81121199