props自定义属性,$emit自定义事件,对吗?
来源:2-17 自定义组件(下)
Aurora_Meteor
2020-05-15 14:20:37
props: {
col: {
type: String,
default: '#000'
}
}
1、col是自定义的属性名吗?然后调用的时候在引入的那个页面里的标签里写这个属性名并且传入属性值就行了?还是说col就是专门表示颜色的,不能用其他名字呢?
2、type和default是默认的两个表示传入值的类型和默认值的参数,还是随意取的名字呢?
3、怎么判断出来传入的内容就是颜色的呢,根据默认值的类型吗?
4、$emit是自定义事件类型吗?在相应的地方调用this.$emit(自定义事件类型),然后在要调用的地方直接写 @自定义的事件类型 ,就可以触发相应的事件了,对吗?
2回答
同学你好,关于同学的疑问,解答如下:
1、col是自定义的名字,不过在子组件使用props接收父组件传递的数据时,要和父组件内的名字保持,如下:
demo10/index.vue:

countdown.vue文件:

2、type是参数的类型,default是默认值,这两个单词是固定的,不能更改。以视频中老师讲解的为例:

传递的参数的类型是字符串,默认值是黑色。
3、因为代码是我们自己写的,规定这里需要得到的是一个颜色值,所以我们在传递的时候就传递一个颜色。
4、可以这样理解。$emit()方法可以在子组件触发父组件的事件。例如:
在父组件中自定义了一个事件,如下:

子组件可以通过$emit()触发

如果我的回答帮到了你,欢迎采纳,祝学习愉快~
好帮手慕言
2020-05-15
同学你好,传入的参数的类型是否符合,是根据type属性来决定的。
例如:type的属性值是字符串,那么在传递的传递时,参数类型不是字符串,那么控制台会有报错。
如果没有传递参数,那么会使用default的属性值,例如:没有传递参数

页面效果:
传递什么参数,完全是根据自己的需求来定,例如同学说的字体大小,那么可以参考下方的例子:
父组件:

子组件:


同学可以自己自己写一写例子,会更有利于自己理解。
如果还有其他疑问,建议在问答区重新提问,便于同学后期查找总结
祝学习愉快~
相似问题