一、页面结构,如下:
1.1 el-radio-group 是一个容器组件,主要配合 el-radio 组件一起使用,通过下图可能看到,可在容器组件内部挂载内容。
1.2 component 中 _elTag 简单梳理,如下:
针对于 _elTag 这个方法,我的疑惑是 this.$vnode.data 这部分,我曾尝试过很多种方法改变组件内部 tag 的默认值,但一直未果,简单的结论是为了组件的灵活性、可拓展性等。
二、el-radio-group 组件属性
2.1 value / v-model 属性,string / number / boolean,无默认值
源码中分两部分:
1、el-radio-group 里面 挂载 el-radio
2、el-form 里面嵌套 el-radio-group
2.1.1 当 el-radio-group 不在 form 中时,对应的源码部分的实现如下:
上面这种 api 写法,会触发下面这两部分的代码,如下:
2.1.2 当 el-radio-group 在 form 表单中时,对应的源码部分的实现如下:
三、el-radio-group 组件方法
3.1 handleChange方法
四、核心代码
在 emitter.js 中有 dispath 这样一个公共的方法,在 radio、radio-group、radio-button源码当中都有涉及,那么这个方法是什么呢?又有什么作用呢?带着这两个问题,我们来研究一下下面这段代码。如图:
问题一:dispatch 是什么?
读者福利
========
由于篇幅过长,就不展示所有面试题了,想要完整面试题目的朋友(另有小编自己整理的2024大厂高频面试题及答案附赠)
![]()
![]()