Antdv
antdv 常见问题解决方案
卡尔特斯
大前端交流群:dengzemiao
GitHub: https://github.com/dengzemiao
掘金:https://juejin.im/user/4450440831840909
展开
-
Vue3/React 动态设置 ant-design/icons 图标
使用方式上,依然达到使用图片名称就能使用图标,下面以。这种标签方式,当需要像以前一样动态切换使用。文件,相当于自己做一个。原创 2023-11-07 15:29:35 · 2597 阅读 · 0 评论 -
Vue3 antdv 如何动态渲染 icons-vue 图标(a-icon 不支持了)
效果,只是图标都需要自行提供,如果想要直接使用官方新版本自带的所有。这种也是可以达到以前版本的。,只能另外的方式处理了。动态使用,代替之前的。原创 2022-07-28 16:55:23 · 7989 阅读 · 5 评论 -
.bezierEasingMixin(); ^ Inline JavaScript is not enabled. Is it set in your op..
自定义 antdv 主题配置时,报错:ERROR Failed to compile with 1 error 上午11:35:54error in ./node_modules/ant-design-vue/dist/antd.lessSyntax Error: // https://github.com/ant-design/ant-motion/issues/44.be..原创 2022-05-03 11:48:26 · 1612 阅读 · 1 评论 -
Vue antdv dropdown 自定义下拉内容 overlay 禁止点击事件下传导致收起
<!-- 自定义列 --><a-dropdown :trigger="['click']"> <!-- 自定义下拉菜单 --> <div slot="overlay"> <!-- 禁止事件下传,这样点击自定义的下拉菜单就不会收起了,注意宽高完全覆盖好 --> <div @click.stop> <!-- 菜单内容 --> </div> </div>原创 2022-02-10 14:59:09 · 3238 阅读 · 0 评论 -
Vue antdv Table 组件悬浮头部与尾部进度条(已封装成组件)
在使用 antdv Table 组件的时候,不限制高度,滚出窗口上方时,发现并不能进行头部悬浮,其他有的框架是支持这个功能的,antdv 目前好像并自带,所以只能手动封装一个组件。DZMTablePlugin-Antdv 下载地址。使用案例代码...原创 2022-01-25 11:50:46 · 1307 阅读 · 0 评论 -
Vue antdv 定制主题配置(高低版本配置问题)
一、简介在使用 ant-design-vue 时,需要修改一下全局的主题颜色,按照官方的配置流程配置失败,应该是版本问题。二、安装 antdv安装 ant-design-vue$ npm i --save ant-design-vuemain.js 中配置,完整引入import Vue from 'vue'import App from './App.vue'import router from './router'import store from './store'/原创 2021-07-05 17:03:19 · 1567 阅读 · 0 评论 -
Vue antdv 报错 .bezierEasingMixin()
Syntax Error: // https://github.com/ant-design/ant-motion/issues/44.bezierEasingMixin();^Inline JavaScript is not enabled. Is it set in your options? in /Users/dengzemiao/Desktop/test/antdvtest/test/node_modules/ant-design-vue/lib/style/color/be原创 2021-07-05 17:01:02 · 3423 阅读 · 1 评论 -
Vue antdv a-select 内容搜索过滤(filterOption,包含 vue2 vue3)
在使用 a-select 的时候,有时候需要支持搜索,这个时候需要跟选项框中的内容进行匹配。这个是要就需要使用到 filterOption 这个属性了<template> <a-select showSearch :filterOption="filterOption" :getPopupContainer="(triggerNode) => triggerNode.parentNode" style="width: 200px" ..原创 2021-05-20 15:38:38 · 20147 阅读 · 9 评论 -
Vue Antdv a-form 表单中使用自定义组件,并支持 v-decorator 效验
一、简介Vue 自定义组件实现 v-model 数据双向绑定在使用 Antdv 中 Form 表单的时候,有时候需要官方自带的组件未必够用。这个时候需要使用到自定义的一些组件,自定义的组件需要支持数据双向绑定,也需要支持 v-decorator 的数据效验,或者默认值设置等等。二、自定义相关组件CustomInput.vue:自定义一个输入框来举例<template> <!-- 包装一个 input,让它支持数据双向绑定 v-model,同时也支持 fo原创 2021-04-23 15:35:43 · 4292 阅读 · 0 评论 -
Vue antdv 下拉菜单不跟着滚动走(getPopupContainer 使用)
在使用阿里的 Ant Design Vue 框架时,在使用有下拉菜单 a-select 等组件,用在 a-drawer 等组件或者页面上的时候,会发现 a-drawer 等组件能滚动的时候,a-select 等组件的下拉菜单不会跟着走,停留在原地。这是滚动之后停留在原地的状态:但是我们希望在滚动的时候,下拉菜单也是需要跟着滚动,一直悬浮在输入框下面,这是正常状态:a-select 代码需要这么写<a-select :getPopupContainer="(trigg..原创 2020-10-22 09:45:46 · 15738 阅读 · 10 评论 -
Vue antdv a-select 自定义 dropdownRender 的内容放到头部
在使用阿里的 Ant Design Vue 框架时,需要自定义一下 a-select如果需要完全自定义下拉框,直接重写 dropdownRender 即可:如果只是需要在官方当前的样式上加点自定义的东西,官方文档里面有现成的效果官方默认效果是这样的:默认自定义dom是在底部的,但是如果需要将下面的自定义dom放到头部,其实很简单,只需要这样修改即可<a-select default-value="lucy" style="width: 120px"> ..原创 2020-10-22 09:45:55 · 10227 阅读 · 8 评论 -
Vue Antdv 上传组件(a-upload、a-upload-dragger)二次封装(DZMAntdvUpload)
在使用 Antdv 上传组件 a-upload 的时候,尤其是允许 选择多文件上传 的时候,可能需要检测 文件重复、文件大小、图片尺寸、图片比例、视频尺寸、视频比例、错误不需要重复提示、批量文件一个不符合都不要进行上传 等常用功能这里将这些功能都封装到了一起,在完全支持原生自带属性的通时,并扩展支持更多常用便利功能,方便开发中节省时间。DZMAntdvUpload 使用,源码注释箱单多,使用简单,扩展性高。<template> <div class="home-vie..原创 2021-03-02 14:30:03 · 8732 阅读 · 0 评论 -
Vue Antdv 列表(table、list)自定义空数据状态UI
列表数据为空的时候,需要更换空数据状态UI,官方文档给的提示是:只能看到 locale 可以传 object,默认值 emptyText: '暂无数据'。怎么才能自定义图片跟文案呢?1、在列表对象上绑定 locale2、自定义一个 Vue 组件,正常封装组件即可,这个组件导入到指定页面,不需要加入到 components 中声明。3、将组件直接写到 emptyText 里面作为 value,组件的传值跟正常使用一致默认效果自定义后...原创 2021-03-18 17:49:56 · 7904 阅读 · 9 评论 -
Vue Antdv a-date-picker 手动关闭弹框(自定义Footer)
Antdv 中 a-date-picker 自定义 footer 之后点击按钮 手动关闭 时间弹窗,默认是不支持的,而且通告官方给出的 open 属性也是无法做到的,因此需要下面的操作:```<template> <a-range-picker ref="range-picker"> <template slot="renderExtraFooter"> <div @click="touchHide">手动关闭</div>原创 2021-04-22 11:42:28 · 3059 阅读 · 7 评论