关于Ant design vue插件中drawer组件阴影小bug

已于 2024-03-04 18:14:13 修改
阅读量364 收藏 8
点赞数 6
文章标签： vue.js bug 前端
于 2024-02-21 11:31:52 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/lb_888888/article/details/136207550
版权

起因是因为要使用到抽屉功能

bug介绍：在使用过程中，有一个阴影，是在ant-drawer-content-wrapper类层级上，因为需求，要删除这个阴影，可我不管怎么使用deep覆盖，总是不生效，试过了加层级来控制，一样不起作用

解决方案：最后没办法，我只好把主意打在源码上，通过在node_modules/ant-design-vue/dist/reset.css文件夹里面添加了

.ant-drawer-content-wrapper{

  box-shadow: none !important;

}，才终于解决了这个问题

摆烂的农民
关注
  • 6
    点赞
  • 踩
  • 8
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
vue ant 主題色設置
qq_28134589的博客
09-13 96
vue 2項目目录 package.json { "name": "myant", "version": "1.0.0", "description": "A Vue.js project", "author": "", "private": true, "scripts": { "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js", "start":
antd 弹框 抽屉 高阶组件封装
weixin_42737733的博客
11-17 1242
在使用atnd组件化弹框时，我们在书写的时候，每次都要控制弹框的visible，包括点击”确定“时，我们需要从弹框内容中获取表单数据，以及需要处理错误返回时弹框的交互，或者时弹框内容的一些变换，这就使代码看起来很混乱，各种不同的功能相互混合，耦合度高，而且每次都需要处理弹框的交互状态，有重复的劳动力。于是这就需要我们单独封装一个组件，在组件中单独处理弹框的功能，暴露出弹框组件的方法，让弹框内容部分的组件使用，让该组件专注业务内容的书写。 高阶组件，可以称之为HOC，即该组件入参一个组件，将该组件经过处理后，
用于设置ant-design-vue中table组件的列宽可拖拽
08-05
vuex2.x中用于设置ant-design-vue中table组件的列宽可拖拽
React自定义Antd抽屉Drawer组件实现鼠标拖拽控制宽度
斑码斑码
04-01 4019
React自定义Antd抽屉Drawer组件实现鼠标拖拽控制宽度
antdv drawer 在界面中做抽屉父级不被撑开 bug
weixin_42516428的博客
11-22 460
问题描述 *. 当放置于容器内时-无法与平级共享父级，而是定位与父级之上，且其外边无法被自动撑开 *. 被超出隐藏无法将元素定位于弹窗左侧 效果图 const width = 300; <div class="DashboardDoorRightDOM" :style="{ width: visible ? `${width}px` : `0px` }"> <a-draw...
ant-design-vue 自由切换 暗黑模式dark
ranshakalove的博客
01-12 5038
ant-design-vue 暗黑模式dark
React 自定义 Antd 中 Drawer 组件实现鼠标拖拽控制长度（上下伸缩）
m0_59564117的博客
07-03 455
【代码】React 自定义 Antd 中 Drawer 组件实现鼠标拖拽控制长度（上下伸缩）
ant当点击Drawer（弹框）以外的阴影不触发关闭
m0_52243496的博客
03-31 1480
ant的drawer抽屉的参数属性： 将maskClosable设置为false，即 :maskClosable=“false”，则可解决触发关闭的问题
2021-07-16
m0_48164934的博客
07-16 358
项目场景： React + Antd + webpack的后台管理项目 问题描述： 在项目中，用到antd里面的Drawer组件，组件内容涵盖图片信息，每次点击大图放大或缩小，关闭抽屉后页面会卡顿。 最开始以为是Image组件的问题，再详细看完官方文档后，发现是Drawer组件的问题，Drawer组件的api中有这样一个参数destroyOnClose,作用为：关闭时销毁 Drawer 里的子元素，默认是false，需设置为true。 原因分析： 正如官方文档所说，关闭抽屉是需...
使用antd-mobie踩了个地雷!!!---Popup组件
u013571243的专栏
03-22 3163
经过数天的布局, 就差数据来render组件了,最后发现Popup组件无法自动刷新 看看popup的设计方式, 它的弹出方式是基于function事件,类似JS插件,但是通过chrome看到popup的内容确实是reactjs, 既然不能自动刷新(可以log看到, 状态通过props下床后,在popup下停止了render) 通过log可以看到在popup层的props数据在父
SpringBoot+AntDesignVue实现excel导入功能
07-20
SpringBoot+AntDesignVue实现excel导入功能
Ant Design Vue 添加区分中英文的长度校验功能
10-15
主要介绍了Ant Design Vue 添加区分中英文的长度校验功能，本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下功能，
ant design vue中日期选择框混合时间选择器的用法说明
01-22
首先时间格式化用到moment方法，需要在页面中引入moment组件 import moment from ‘moment’ 结构代码： <a> triggerNode[removed] format=YYYY-MM-DD HH:mm:ss v-decorator=[ 'pushtime', { rules: [{ ...
ant design vue中表格指定格式渲染方式
01-18
注意点：定义的columns一定要写在data中，否则在加载过程中由于渲染顺序会导致其中的渲染函数无法识别 渲染方法1： 指定渲染函数： const columns = [ { title: '排名', dataIndex: 'key', customRender: ...
vue快速入门（四十六）Router的安装与使用
最新发布
不起眼小菜菜的博客
04-26 434
步骤很详细，直接上教程……
vue echarts 柱状图 堆叠柱状图
Z18834071903的博客
04-26 228
vue echarts 柱状图 堆叠柱状图
vue 实现级联选择器功能
清音的博客
04-22 538
数组包含了级联选择器的数据源，其中每个对象表示一个选项，包括。组件来实现级联选择器功能,下面是一个示例代码，演示如何使用。组件初始化级联选择器，并设置默认值为单位。对象用于指定数据结构中的属性名，以便。上，可以在初始化时选中指定的值。使用 Element UI 的。中设置初始选中值为单位。组件正确地解析数据。
vue-manage-system 更新，后台管理系统开发更简单
林鑫
04-22 430
近期进行了一次版本升级，主要是支持了更多功能、升级依赖版本和优化样式，并且上线了网站，大部分功能都有文档或者使用示例，更加适合新手上手开发，只需要根据实际业务简单修改，就可以完成产品需求。
antdesignvue a-drawer
05-20
Ant Design Vue 的 `a-drawer` 是一个抽屉组件，可以在屏幕边缘或者页面中央弹出，展示一些额外的内容或者操作。它可以用来替代传统的模态框，提供更好的用户体验。`a-drawer` 可以设置多种属性，如 `visible` 表示抽屉是否可见，`closable` 表示是否显示关闭按钮等。此外，还可以通过 `placement` 属性设置抽屉的位置，包括 top、right、bottom 和 left。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值