uni-app小程序升级为自定义组件模式注意事项

manifest.json文件中
“usingComponents” : true 自定义组件模式, false 非自定义组件模式

1、自定义组件模式
编写组件时,避免使用tagName, ID, attribute 三种选择器;

2、$emit
非自定义组件:
中划线连接或驼峰连接都可以
vue 官网推荐emit的函数名用中划线链接

this.$emit('upload-image', data, this.dataName);
@upload-image="uploadImage(arguments)"

uploadImage(data) { 
//data为一个数组,第一个参数为emit中的data,第二个参数为emit中的this.dataName
}

自定义组件模式:
emit中使用中划线父函数中接受不到

this.$emit('uploadImage', [data, this.dataName]);

@upload-image="uploadImage"
或
@uploadImage="uploadImage"

uploadImage(data) { 
//data子组件emit传出来的数组数据
}

注意:emit的函数名使用驼峰的方式,则自定义组件模式和非自定义组件模式都支持。

3、props
(1)非自定义组件模式可以拿到dataName属性的值,自定义组件模式拿不到,将dataName改为别的名字就可以拿到,如attrName
(2)props中的属性的type值
非自定义组件模式下,type带不带引号都可以,vue 官方是不带引号。
自定义组件模式下,type不能带引号,不然后报错。

你可能感兴趣的:(技术分享)