自己封装的input组件，placeholder-class使用外部样式不生效？ - WXOPEN Club

代码示例：

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