el-input接收到后端传来的数字保留两位小数

1,el-input一般都是由v-model绑定数据的,那么怎么把接收到的数据保留两位小数呢

<div class="inputDIV" style=""><el-input type="text"   v-model="Number(List.price).toFixed(2)"  readonly="readonly" ></el-input></div>
           

如上图所示,Number(List.price).toFixed(2)才可以实现保留两位小数,如果直接用toFixed()会报错。 

2,如果我们还想让el-input的文字居中显示呢,据我了解到的需要在外边加上一个div

.inputDIV>>>.el-input__inner {
    border: none;
    text-align: center;
  }

div的class是inputDIV,border: none; 设置el-input没有边框,text-align: center;设置el-input的文字居中显示。

  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
你可以使用Vue的条件渲染指令v-if或v-show来根据后端传来数字来决定显示不同的文本。例如,如果数字为1,则显示文本“文本1”,如果数字为2,则显示文本“文本2”。 你可以在Vue的模板中使用v-if指令来实现条件渲染。示例代码如下: ```html <template> <div> <el-input v-model="number"></el-input> <div v-if="number === 1">文本1</div> <div v-if="number === 2">文本2</div> </div> </template> ``` 在上面的示例代码中,el-input组件绑定了一个number变量,当用户输入一个数字后,就可以根据这个数字来决定显示不同的文本。 在v-if指令中,我们可以使用JavaScript的比较运算符来判断数字是否等于1或等于2,从而决定是否显示文本。如果数字等于1,则会显示“文本1”,如果数字等于2,则会显示“文本2”。 如果你想要在页面加载时默认显示一个文本,你可以使用Vue的computed属性来计算需要显示的文本。示例代码如下: ```html <template> <div> <el-input v-model="number"></el-input> <div>{{ text }}</div> </div> </template> <script> export default { data() { return { number: 1 } }, computed: { text() { if (this.number === 1) { return '文本1' } else if (this.number === 2) { return '文本2' } else { return '其他文本' } } } } </script> ``` 在上面的示例代码中,我们使用了Vue的computed属性来计算需要显示的文本。当用户输入一个数字后,computed属性会根据这个数字来计算需要显示的文本,并将其渲染到页面上。如果数字不等于1或2,则会显示“其他文本”。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值