![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
ant design组件库使用
大佩梨
平时会分享、记录前端相关知识,喜欢的可以点个关注点点赞谢谢哈!
展开
-
ant design vue a-modal实现弹窗拖拽功能
vue ant-design中a-modal实现拖拽功能原创 2022-06-01 10:42:55 · 3850 阅读 · 2 评论 -
a-date-picker隐藏部分日期选择例子
1.在改日期控件中自定义方法:disabledDate2.接着需求是可以选的日期:不能是创建日期(创建该订单日)之前:代码如下: //限制不能选择当前日期之前 disabledDate(current) { let createTime = this.$refs.payableInfo.detailList.receivableStartDate//创建日:2022-01-19 let createDate = new Date(createTime)//创建日转时原创 2022-02-28 10:14:24 · 393 阅读 · 0 评论 -
a-form(设计重置,赋值,校验)
1.在页面使用a-form2.在beforeCreate中创建form beforeCreate() { this.form = this.$form.createForm(this); },3.使用 v-decorator 用idCard绑定input的值。rules <a-form-item label="身份证号码" v-bind="formItemLayout" style="width: 40%;"> <a-input原创 2021-12-29 19:53:04 · 5764 阅读 · 0 评论 -
ant a-date-picker日期选择组件限制选择日期
需求:不能选中当前日之前的日期:首先,在组件上写上 :disabledDate=“disabledDate” <a-date-picker ref="expiryDate" :value="defaultExpiryDate" placeholder="请选择到期日期" style="width: 100%" @cha原创 2021-12-27 10:44:35 · 1362 阅读 · 0 评论 -
a-form-item添加:requred=“true“属性
a-form-item添加:requred="true"属性即可在label处加红色星号:如下图:显示效果:注意:该效果只在ui层面上原创 2021-12-13 14:19:07 · 920 阅读 · 0 评论 -
ant design confirm确认框的应用
用法如下:this.$confirm({ // iconClass: 'el-icon-question', //自定义图标样式 title: '提示', content: '账户名称与企业名称不一致,请确认是否提交?', confirmButtonText: '确认', //确认按钮文字更换 cancelButtonText: '取消', //取消按钮文字更换原创 2021-11-29 15:20:46 · 4173 阅读 · 0 评论 -
ant input框限制默认去除空格和非数字
1.这里采用的是在@change="clearSpace"的方式实现:<a-input v-model="invoiceNo" placeholder="请输入发票号码" @change="clearSpace"/>然后在vue中methods里写对应规则methods: { // 输入框空格限制输入 clearSpace(e) { this.invoiceNo = e.target.value.replace(/\s+/g, '') this.原创 2021-11-29 10:14:45 · 2075 阅读 · 0 评论