![](https://img-blog.csdnimg.cn/20201014180756923.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
ant-design-vue
文章平均质量分 73
ant-design-vue配合vue的使用
好苦呀
外向是生活所需,孤独是自我享受。
展开
-
vue中使用ant design vue的checked
今天有一个需求,后端给了俩条数据ckTeamAllMembers: ["琳", "克", "思", "符兴", "于", "胡方", "伍煜", "洪波", "均铨", "华"];taskSelectedMembers: ["符兴", "洪波", "伍煜", "思", "胡方"];需求就是让相同的值默认在checked的显示出来,但是不能点击,刚开始想的就是先把这俩个数组合并起来然后筛选不同的值出来,这样就可以了。这里边不能使用:default-value要使用value<a-check原创 2020-09-17 17:30:47 · 3692 阅读 · 0 评论 -
vue中使用ant design vue的table和单选框(radio)配合使用
现在的需求就是在每个table渲染的列里边渲染每一个,改一个值的话,就给后端传改的那个值,如果改一个值的话,就传一个,改几个传几个,现在的方法就是先给一个空字符串,改一个就把值赋值到那个空字符串中。<template slot="handleResult" slot-scope="text, record"> <a-radio-group v-model="record.dataStatus" @change="onChangeRadio"> <a-radio原创 2020-09-27 18:35:21 · 6891 阅读 · 0 评论 -
vue中使用ant design vue的table之(rowkey)
直接设置一个rowkey=‘id’ <a-table bordered :data-source="dataSource" :columns="columns" rowKey="id" >就不会报那个必须设置rowkey的警告了。原创 2020-09-27 14:17:32 · 7952 阅读 · 4 评论 -
vue中使用ant design vue的单选框(Radio)
话不多说,直接上代码 <template slot="ckResult" slot-scope="text, record"> <a-radio-group :defaultValue="Number(record.ckResult)" @change="onChangeRadiockResult"> <a-radio :style="radioStyle" :value='0'> 符合原创 2020-09-27 14:14:14 · 11832 阅读 · 2 评论 -
ant design vue结合jeecg合并单元格数据
customRender:function (t,r,index) {// ckStartDate 和 ckEndDate是后端传来的数据var xx = ckStartDate + "~" + ckEndDate;return xx;}这俩个一个是开始时间一个是结束时间,原创 2020-09-14 16:12:36 · 993 阅读 · 0 评论 -
利用ant desigin for vue写的一个时间选择器(只选择年份)
废话不多说,直接上代码<a-select v-model="queryParam.year" placeholder="请选择检查年份"> <a-select-option v-for="(item,index) in listYear" :value="item.value" :key="index">{{ item.key }}</a-select-option></a-select>data () { return { ··· li原创 2020-09-11 17:26:20 · 978 阅读 · 0 评论 -
ant design vue树结构的expand和select的方法
你想点击第一个不做一些事件做正则判断 let reg = /^0-[0-99999]+$/; let isTrue = reg.test(e.node.pos);点击第一个不展示数据,点击第二层展示数据原创 2020-12-04 16:32:58 · 1187 阅读 · 0 评论 -
ant design vue 使用树形控件(tree)点击节点expand判断的方法
当你想使用这个组件的时候,但是你点击一级树的时候调用一个接口,点击二级树的时候在调用另一个接口,那你就需要在点击一级节点的时候不用调用二级节点。那需要怎么做的,说一下我的思路,如果大家有别的更简单的方法,欢迎评论留言呐。因为人家组件自带的方法expand有自带的参数,有一个node,node是一个对象,对象里面有一个pos的字符串,我就是判断的那个,用正则表达式匹配如果是0-0~0-9999的时候调用一级节点,如果是0-0-0的时候调用二级。let reg = /^0-[0-99999]+$/; //原创 2020-11-12 11:07:10 · 6763 阅读 · 4 评论 -
ant design vue(upload)上传文件不显示删除按钮
有一种办法是直接给a-upload加disbale <a-upload // 加这句代码就行了 :disabled="(title === '查看') || (status === 'A')" // 还可以加这个 这个是组件自带 :showUploadList={{showRemoveIcon:false}} :action="getUploadAction()" list-type="picture" :headers="tokenHeader" @c原创 2020-11-10 16:38:01 · 6019 阅读 · 0 评论 -
vue使用ant design vue 树型控件(tree)
遇到的需求就是一级结构不要checked框,二级结构也不要,三级结构才需要,那么需要怎么做呢,因为人家给的结构是这样子的checkable这个是一定要加的,要不不会显示出来 <a-tree v-model="checkedKeys" checkable :expanded-keys="expandedKeys" :auto-expand-parent="autoExpandParent" :selected-keys="selectedKeys" :tree-d原创 2020-11-09 09:12:24 · 6333 阅读 · 4 评论 -
使用ant-design-vue(select)遇到的问题,解决重置之后清空值
当你的select-option是循环出来的时候,你点击清空以后这个值是不会清空的,当你使用组件自带的api – allowClear的时候,你会发现清空以后是undefined,所以当你清空的时候,你可以在select标签上使用v-model。<a-select v-model="year" allowClear @change="changeYear" placeholder="请选择检查年份"> <a-select-option v-for="(item,index) in原创 2020-10-30 10:44:33 · 9402 阅读 · 5 评论 -
vue使用ant design vue的collapse
在使用折叠面板的时候,应该是点击以后就会关闭一个面板,但是有的需要点击俩下,才可以展开,就是因为v-modal影响了这个v-modal改成activeKey<a-collapse accordion @change="changePanel" activeKey="activeKey">data () { return { ... activeKey: ['0'], }}changePanel(key) {// 组件自带的key相当于下标,就是循环出来每一个折叠面板,第原创 2020-10-28 18:14:51 · 4445 阅读 · 12 评论 -
使用ant design vue组件(保持默认参数的存在,传更多自己需要的参数)
先允许我唠叨下,应该很多人都会,那我也记录一下。理解一下。使用组件有一个参数的时候直接使用$event<a-date-picker :default-value="moment(item.createTime)" @change="createTimeChange($event,你需要传的参数)"/>createTimeChange($event,你需要传的参数) { console.log(e,你传的参数)}在使用ant design vue的日期组件的时候因为人家默认传的是俩原创 2020-10-15 16:30:17 · 1792 阅读 · 2 评论 -
vue使用ant design vue(upload)文件上传
使用remove的时候是一个函数,刚开始我用的@remove后来用上:remove才可以,因为接收的是一个(点击移除文件时的回调,返回值为 false 时不移除。支持返回一个 Promise 对象,Promise 对象 resolve(false) 或 reject 时不移除。)文档原话,刚开始不知道返回值是什么,蒙了,返回值就是return。 <a-upload :action="getUploadAction()" list-type="picture" class="uplo原创 2020-10-15 10:30:19 · 15887 阅读 · 0 评论 -
vue中使用ant-design-vue清空value的问题
是因为再点击重置的时候你的input或者checkedbox没有绑定value值或者v-bind<a-input placeholder="请输入检查项目" @change="changeProject" :value='project'></a-input><a-checkbox @change="onChangeBenchmarking" v-model="benchmarking"> 仅显示对标标准</a-checkbox>data ()原创 2020-10-10 18:09:22 · 2858 阅读 · 0 评论