- 以改变input的placeholder颜色为例子
<div class="red_bg">
<input ref="is" type="text" placeholder="请输入内容">
</div>
- 设置事件,动态更新css的值
mounted() {
// 解决input颜色问题,动态的值
this.$refs.is.style.setProperty('placeholderColor', this.infoData.text_color);
},
- Css样式
<style lang="less" scoped>
.red_bg {
height: 100%;
width: 100%;
placeholderColor: #000000; // 默认颜色
input::-webkit-input-placeholder{
color: var(placeholderColor); // 动态值
}
}
</style>
- 补充,微信小程序可以直接设置placeholderStyle来改颜色;
<input type="text" placeholder="请输入" placeholder-style="color: red;"></input>
- 参考文章: https://www.jb51.net/article/189040.htm;
版权声明:本文为rRainyevening原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。