Ant desgin
V_zcm
全栈学习中。
展开
-
Ant design-13
本节:栅格化响应式,在vue项目中安装ant design原创 2022-08-29 18:00:03 · 627 阅读 · 0 评论 -
Ant design-04 status的传送
本节:按钮状态的传递。(刷新是证明真正传送到后台了。)1.显示的状态设置。2.接收数据表格的变量的定义3.点击之后的状态传送,调用方法。3.方法的编写。完整代码:<template> <div> <div> <template> <a-breadcrumb separator=""> <a-breadcr...原创 2021-12-29 22:45:28 · 627 阅读 · 0 评论 -
Ant desgin-08 状态和推荐按钮的传输
本节:1.表格 <!-- false和true --> <span slot="isRecommend" slot-scope="text, record"> <div> <a-switch @change="switchTuiJian(record)" :checked="text" /> </div>原创 2021-12-31 14:08:07 · 614 阅读 · 0 评论 -
Ant design-02修改數據
本节:修改数据。1.点击编辑,获取当前id的所要数据2.修改模态框的创建3.方法的创建原创 2021-12-27 20:39:10 · 293 阅读 · 0 评论 -
Ant design -01 自定义表格内容样式
本节:在Ant design框架里面,自定以内容样式。1.自定义表单内容 ,自定义样式。ps:如果想自定义样式,又要循环数据,就用{{text}}循环出来原创 2021-12-16 17:44:50 · 1942 阅读 · 0 评论 -
Ant design-06 在表格里渲染图片
本节:在表格里面渲染出图片1.在表单这里加:<div slot="via" slot-scope="text"><img :src="cdn + text" alt="" srcset="" style="width: 50px" /></div>2.在栏目数据这里加 : scopedSlots: { customRender: 'via' },就可以了...原创 2021-12-30 15:05:27 · 815 阅读 · 0 评论 -
Ant design-07 上传图片
本节:在表单里面上传图片(以为很难,其实很简单)1.表单里,上传写的内容: <a-form-model-item prop="via"> <upload-widget v-model="addData.via"></upload-widget> </a-form-model-item>2.传输的对象定义;栏目的捆绑3.接口数据传输过去就可以 了...原创 2021-12-30 15:29:30 · 977 阅读 · 0 评论 -
Ant design-03 查找数据
本节: 在Ant design 框架中的,查找数据1.输入框绑定要搜索的数据,按钮绑定点击事件,调用搜索功能。2.表单绑定变量控制是否显示。注意搜索之后的表格,连接的是搜索之后的数据表。3.变量的定义4.搜索功能...原创 2021-12-28 10:18:01 · 501 阅读 · 0 评论 -
Ant design-05 表单多选的组件
本节:多选功能的表单table主要加的内容:1.<a-table :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }" :columns="columns" :data-source="data" />2.在data上面加const data = [];for (let i = 0; i < 46; i++) { data.pu...原创 2021-12-30 10:37:44 · 1558 阅读 · 0 评论 -
Ant design-12 表单里推荐和不推荐
本节:循环表单里,怎么控制单个变量的变化。1.div2.数据的定义3.变化方法的编写所有代码:<template> <div> <div style="margin: 16px 0px"> <template> <a-breadcrumb> <a-breadcrumb-item><a href="">5G网络..原创 2022-01-06 17:50:51 · 475 阅读 · 0 评论 -
Ant design-11导出Excel表格
本节:导出Excel表格当服务器写好功能时,直接定义点击事件,然后调用就可以了。 async exportList() { window.open(`${this.serverUrl}consult/to_excel?consultsIds=${this.ex_id}`); alert('导出成功'); },...原创 2022-01-06 17:21:02 · 367 阅读 · 0 评论 -
Ant design-10 单个上传和批量上传
本节:如果想要上架和批量上架都使用同一个接口,那么接口的传参要一致。1.div批量上传点击事件:点击单个上传的事件: :row-key="(record) => record.id" :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"2.定义用来存放获取当前id所有信息的数组3.定义接口功能,定义单个点击上传,批量上传的...原创 2022-01-06 17:16:17 · 1721 阅读 · 0 评论 -
Ant design-09 搜索文字和栏目内容
本节:根据栏目内容或者文字来搜索内容。1.div栏目的: <div> <a-select v-model="suosParentsId" placeholder="请选择" style="width: 200px" @submit="suos" @submit.native.prevent> <a-select-option v-for="(col, index) in columnsA原创 2022-01-04 17:37:16 · 268 阅读 · 0 评论