ElementUI输入框后加固定的自定义内容（数值单位等）

最新推荐文章于 2025-06-25 15:28:20 发布

极光雨雨

最新推荐文章于 2025-06-25 15:28:20 发布

阅读量3.4k

点赞数

CC 4.0 BY-SA版权

分类专栏： # JavaWeb开发 # 前端开发实战总结文章标签： elementui

本文链接：https://blog.youkuaiyun.com/weixin_44131922/article/details/117908661

JavaWeb开发同时被 2 个专栏收录

107 篇文章

订阅专栏

前端开发实战总结

5 篇文章

订阅专栏

这段代码展示了在前端开发中使用Vue.js组件`CommonFormItem`进行资金字段的输入验证和展示，通过`v-model`双向绑定数据，并利用`ElInput`组件进行输入框的样式定制，设置`placeholder`和`readonly`属性。`validDecimal(10,2)`规则确保了资金输入为两位小数的十进制数值。此外，输入框后用`slot=append`添加了单位'万元'。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<ELCol :span="12">
<CommonFormItem label="资金" prop="foreignEntity.registeredCapital" :rules="validDecimal(10,2)">
<ElInput placeholder="请输入金额" v-model="projectData.foreignEntity.registeredCapital" :readonly="isReadonly" >
<template slot="append">万元</template>
</ElInput>
</CommonFormItem>
</ELCol>