vue学习笔记(二):属性、事件、插槽

UI框架使用:ant-design-vue

一、属性:自定义属性props

            原生属性attr

             特殊属性:style、class(ref , key)



style:要注意优先级(后加载的优先级高)

class:合并

inheritAttrs: false,//取消默认属性

二、事件

this.$emit的返回值是:当前的Vue实例。

所谓的触发事件,其实就是在调用父组件传递的方法。如果我们在方法中return了值,子组件通过事件的方式调用这个方法是拿不到的,但有的时候我们需要父组件的这个值,做进一步的处理。--(callback来解决)

stop修饰符:阻止事件冒泡

三、插槽

2.6.1:具名插槽作用域插槽 => v-slot指令【取代slot和slot-scope,被废弃但未被移除】

1.普通插槽:父->子,父组件传递数据/元素/组件给子组件,子组件定义占坑 

2.作用域插槽:子->父,子组件绑定属性,传递(数据)给父组件,父组件通过slot-scope接收子组件传递属性 

3.使用v-slot新语法,代替旧语法slot-scope

4.多插槽时使用具名插槽方式(<slot name="header">),用于将数据绑定在指定的插槽

问题:

相同名称的插槽是合并还是替换:新的2.6语法替换,老的语法合并

函数式组件

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容