微信小程序坑-父组件向子组件传递样式无效

<template name="com-transverse-swiper-2">

<view class='wrapper-2'>

<!--创建父组件实例所引入的子组件的实例-->

<com-ico ico-two="ico2" ico-left-2="icoLeftTwo" content="¥ 10"></com-ico>

<view class='show-img'>

<image></image>

</view>

<text class='title'>美味坚果</text>

<text class='content'>美利坚大礼包750g</text>

</view>

</template>
 

Component({

properties: {

content: { //显示内容

type: String,

value: ""

}

},

//ico-two 外部定义ico容器的宽高 ico-left-two 外部控制ico的大小和旋转角度 外部控制content-txt文字角度 颜色

externalClasses: ["ico-two", "ico-left-2", "content-txt"]

})

错误分析
1.微信小程序是一个需要编译后才能执行的文件。这个时候,由于父组件提高tmeplate模板创建子组件的组件实例时向ico-left-2时
传入的-2是数字,编译器就会认为这个ico-left-2不是一个对象的属性,会被解析为ico-left这个变量名减2,因此会导致这个对象的
ico-left-2无法接收到父组件传入的CSS
解决方法
将内部的ico-left-2更改为字母,比如ico-left-two,外部调用时改完ico-left-two。这样传入时,编译器就会正确解析,不会将-two
的-解析为减号。

猜你喜欢

转载自blog.csdn.net/qq_38603437/article/details/89304667