ant-design-vue 转换文本框输入内容类型

使用ant-design-vue的时候由于需要使用带%样式的文本框样式(即addonAfter);

用了普通文本框,但是这个文本框内容默认是字符串,验证的时候会报错;
当然可以有其他方式解决,但是在文本框上直接格式化才是比较优雅的解决方式,如是有了以下代码:

 <a-input
            style="width: 100%"
            addonAfter="%"
            v-decorator="['centralFinanceRatio',
                   {rules: [
                    { required: true, message: '请输入比列'},
                       {type: 'number',transform:(value)=> {return Number(value)},pattern: '^[0-9]+(.?[0-9]{1,2})?$', message: '请输入不超过两位小数的数值'}
                  ]}]"
          />

有同样需求的小伙伴可以参考一下

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 基于Vue的一些资料 内容 UI组件 开发框架 实用库 服务端 辅助工具 应用实例 Demo示例 element★...
    尝了又尝阅读 4,911评论 0 1
  • UI组件 element- 饿了么出品的Vue2的web UI工具套件 Vux- 基于Vue和WeUI的组件库 m...
    流觞小菜鸟阅读 5,871评论 2 8
  • UI组件 element- 饿了么出品的Vue2的web UI工具套件 Vux- 基于Vue和WeUI的组件库 m...
    小姜先森o0O阅读 13,336评论 0 72
  • UI组件 element- 饿了么出品的Vue2的web UI工具套件 Vux- 基于Vue和WeUI的组件库 m...
    柴东啊阅读 15,925评论 2 140
  • 易贝源老师:宝宝健康的晴雨表 对于宝宝饿健康,家长们都很上心。其实,大家想要知道宝宝是否健康很容易,只需分辨他大便...
    661977d7a6ed阅读 1,481评论 0 0

友情链接更多精彩内容