记录一个简单的方法,在表单输入金额数字时显示金额(¥)符号,主要是用css样式实现。效果如下:
具体代码如下:
在el-form-item上添加一个类,moneyStyle为自定义的类名
<el-form v-model="formData">
<el-form-item label="金额" prop="money" :class="[{moneyStyle:isMoney(formData.money)}]">
<el-input v-model="formData.money"></el-input>
</el-form-item>
</el-form>
methods: {
isMoney(data) {
return data ? true : false
},
}
<style lang='less' scoped>
// 金额样式
.moneyStyle {
.el-input::before {
content: "¥"; // content: "\FFE5";
position: absolute;
left: 5px;
top: 0;
color: #000000;
font-size: 14px;
}
.el-input__inner {
padding: 0 20px !important;
}
}
</style>