[微信小程序]<input>组件，占位符样式异常 [你这句话把握搞懵了。]
为了更好的讲解这个Bug，我给出三份代码片段
//index.wxml
|
bindblur="blur"
placeholder="abcdefghijklmnopqrstuvwxyz"
|
//index.wxss
.focus{ color: blue;
background: green;
}.blur{ color: red;
background: yellow;} |
//index.js
|
focus: function () {
this.setData({ focus: true });
blur: function () {
this.setData({ focus: false });
}); |
------------------------------------------------------------------------------------------------
代码非常简单，
当输入框聚焦时，data.focus==true
当输入框失焦时，data.focus==false
placeholder-class属性与data.focus数据绑定
并监听data.focus中的数据变化，修改文字与背景样式
正常情况下，当输入框 失焦 时，文字应为红色，背景应为黄色
正常情况下，当输入框 聚焦 时，文字应为蓝色，背景应为绿色
------------------------------------------------------------------------------------------------
Bug①（仅出现在iOS平台）：聚焦时文字颜色异常
------------------------------------------------------------------------------------------------
Bug②（Android与iOS平台同时存在）：清空输入框后，背景颜色异常
------------------------------------------------------------------------------------------------
Bug③（仅出现在Android平台）：在输入框聚焦与失焦状态下，小写英文字母，字体不一致
对比一下聚焦状态
