代码示例:
input.wxml
< input class = "pps-class pps-input-el pps-color-gray {{clearable?'pps-input-clearable':''}}" placeholder = "{{placeholder}}" type = "{{type}}" disabled = '{{disabled}}' maxlength = '{{maxlength}}' cursor-spacing = "{{cursorSpacing}}" value = "{{val}}" focus = "{{focus}}" bindinput = "bindChange" bindfocus = "bindFocus" bindblur = "bindBlur" placeholder-class = "pps-placeholder" > </ input > |
input.js
Component({ options:{ addGlobalClass: true }, }) |
app.wxss
.pps-placeholder { color : #CCCCCC ; } |
问题复现:
input.wxml是自定义input组件,将小程序原生input再封装了一层,组件声明了addGlobalClass为true,即外部样式可以影响自定义组件。
input placeholder-class使用的是app.wxss中定义的样式,但实际上placeholder的颜色未生效。
组件声明了addGlobalClass为true是表示你在class里用的样式可以影响input,并没说placeholder-class可以直接影响input,所以你应该在你封装的input中加入属性保存这个样式名,然后将这个变量赋值给微信input