![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
antd-design
hzxOnlineOk
这个作者很懒,什么都没留下…
展开
-
【Antd】antd的Form表单项用Form.Item包裹后,表单校验不生效的原因及解决办法
包裹住了,这会导致无法被Form表单识别并抓取,因为Form默认只允许放一个子元素。的样式,起到和内部放置div一样的效果,可以认为。这时候我们应该增加一个。原创 2023-11-22 20:57:52 · 1501 阅读 · 0 评论 -
【Antd】antd-Form表单配置自定义rules 自定义表单校验
antd自定义表单校验转载 2023-03-14 16:23:23 · 480 阅读 · 0 评论 -
【Antd】antd Table组件ellipsis: true 不显示省略号
组件的columns配置某一列的。后,没有按照预期显示出省略号。函数中,dom元素不要用。行内元素(span)原创 2023-03-10 17:08:24 · 167 阅读 · 0 评论 -
【ant-design】Upload组件如何上传文件的同时,上传其他数据
使用formData的形式传参即可实现。原创 2023-02-15 09:27:54 · 394 阅读 · 0 评论 -
【Antd】react 和 vue Modal弹框二次点击不再初始化Modal组件内部问题的解决办法
【代码】【Antd】react 和 vue Modal弹框二次点击不再初始化Modal组件内部问题的解决办法。原创 2023-02-10 11:32:10 · 206 阅读 · 0 评论 -
antd Select组件的allowClear点击失效 无法清空
antd Select组件的allowClear点击失效 无法清空? 观察发现,由于同时设置了value属性和allowClear属性, 导致无法点击X清空当前选中项,官方相应的文档并没有提供allowClear点击事件让我们订制自己的事件,因此,解决办法是去除value或者 获取到X清空的dom元素,增加点击事件....原创 2019-03-11 10:45:50 · 14301 阅读 · 0 评论 -
【ant-design】Table 在 Flex 布局情况下, 无限加宽的问题
https://github.com/ant-design/ant-design/issues/10902原创 2023-01-12 19:06:03 · 723 阅读 · 0 评论 -
【ant-design】Menu组件刷新页面后默认选中项不对 浅谈openKey与selectedKeys的关系
如上图所示,如果菜单只有一级菜单,而非多级菜单(而如果是多级菜单,则需要通过。原创 2023-01-09 15:13:00 · 1679 阅读 · 0 评论 -
【css】修改默认滚动条样式 antd修改滚动条样式
css修改默认滚动条样式 antd修改滚动条样式。原创 2023-01-05 19:08:26 · 629 阅读 · 0 评论 -
【antd】Table的rowKey设置后仍warning警告key重复的原因
ant Table的rowKey设置后仍warning警告key重复的原因。原创 2022-12-28 19:18:48 · 863 阅读 · 0 评论 -
【Antd】Table的斑马线行背景色设置
Table的斑马线行背景色设置原创 2022-11-17 17:23:45 · 1873 阅读 · 0 评论 -
【Antd】解决select的placeholder不显示
将select的初始值变更为undefined。原创 2022-11-17 16:48:10 · 307 阅读 · 0 评论 -
【Antd】Tabs组件切换tab栏时react hooks的useEffect不执行原因及解决
antd的Tab组件没有执行重新渲染,他只在每一个Tab第一次点击时生成,进行一次渲染,之后点击回去不再渲染子组件。原创 2022-10-08 14:52:31 · 1702 阅读 · 0 评论 -
Warning: Instance created by `useForm` is not connect to any Form element. Forget to pass `form` pro
当我注释掉所有form.getFieldsValue 以及form.setFieldsValue后,就不再报警告了。之后经过查找相关资料,是由于在Form组件未初始化完成就进行form对象赋值,引起的操作异常。使用定时器setTimeout延迟setFieldsValue的赋值经过尝试,不使用antd的Form.useForm,改成使用。来引用form的ref, 用。原创 2022-09-16 18:20:15 · 157 阅读 · 0 评论 -
【ant-design】分页器英文如何转中文
ant-design分页器英文如何转中文。原创 2022-09-14 10:31:50 · 1083 阅读 · 0 评论 -
树节点互斥的最关键逻辑判断依据
我们经常会碰到多级节点树的选择,有时候产品会要求我们实现节点的互斥,这种互斥效果与Antd的那种效果不同,antd有2种模式1、普通模式即默认勾选父节点,子节点全部选中,子节点全部勾选,父节点也勾选,否则只要有子节点勾选并且没有全部勾选,父节点就是半勾选状态2、严格模式子节点的勾选和父节点的勾选互不影响,我们需要依据我们自己的业务需求,去控制选中值我这边要讲的就是这第二种我接到的需求是,节点有2级,勾选父节点,子节点取消勾选;勾选全部子节点,父节点就勾选,并取消子节点的全部勾选。经过2次写互斥原创 2022-04-18 15:19:37 · 554 阅读 · 0 评论 -
关于Ant.design的RangePicker日期范围限制的实践(限制当前日期之前日期可选)
<Col span={8}> <Form.Item {...itemLayout} name="dotime" label={ <div style={{ textAlign: 'right' }}> <span> 执行日期</span> <span className={styles.a_symbo原创 2022-03-11 09:39:46 · 4341 阅读 · 0 评论 -
修改antd的默认样式,且不影响全局样式
目的### 修改antd的默认样式### 不污染全局样式实现方法### antd提供了 :global修改全局样式的写法### 需要加个命名空间(容器组件类名),避免造成覆盖全局样式在内部的容器组件内(一般组件).namespace{ :global{ .ant-input{ border: none; } } } 实现效果: 去掉class名为namespace下的antd输入框的边框,antd的样式名一定要写在global里面才能生转载 2022-02-28 15:56:52 · 2089 阅读 · 0 评论 -
ant-design table实现可伸缩列 (神坑:4.17.1版本文档没有可伸缩列)
记录一个antd神坑问题:博主想要实现一个列表的可伸缩列但是antd4.x的官方文档并没有相关demo文档记录经过一番排查发现antd3.x是有可伸缩列这一项的demo的地址是:https://ant.design/components/table-cn/#components-table-demo-resizable-column神奇的是当我用该地址切换4.x,4.x出现了可伸缩列这一个demo而当我去掉url的#components-table-demo-resizable-colum原创 2021-11-26 17:11:34 · 1754 阅读 · 7 评论 -
antd4.x Rangepicker 赋初始值报错
antd4.x 的Rangepicker 组件的值是采用[Moment,Moment]数组形式但是,不接受.format('YYYY-MM-dd')格式化后的值原创 2021-11-11 11:37:07 · 840 阅读 · 0 评论 -
解决ant design 4.17.0版本以下 TreeSelect搜索过滤不了树节点
<TreeSelect showSearch style={{ width: 300 }} dropdownStyle={{ maxHeight: 300, overflow: 'auto' }} treeData={treeData} // 树数据列表 placeholder="请输入" onChange={() => this.onChange} treeNodeFilterProp="title" // 官网解释说,输入项过滤对应的 treeNode 属性转载 2021-11-08 20:23:32 · 1822 阅读 · 1 评论 -
react 开启MFSU遇到的问题“antd/es/tree-select/style” does not exist in container mfsu导致热更新失效
博主想使用新的组件,但是MFSU的原理是预编译而非运行时编译,如此以避免每次不必要的重复文件编译。不过这也同样带来新的问题,即如果使用的组件不在之前的构建范围内,会即刻报错,例如博主使用Antd 的 Tree-Select组件:`antd/es/tree-select/style does not exist in container`解决办法是:删除.umi文件,重新构建......原创 2021-11-05 16:29:32 · 3445 阅读 · 2 评论 -
antd pro 无法修改或者覆盖样式
antd pro 创建的项目,一般会生成一个global.less文件在该文件中写覆盖样式类名及其属性即可原创 2021-10-28 16:05:08 · 3218 阅读 · 0 评论 -
ant design 中 select的option 随页面滚动条滚动的bug问题
原代码(有bug代码):<Select defaultValue="lucy" style={{ width: 120 }} onChange={handleChange}> <Option value="jack">Jack</Option> <Option value="lucy">Lucy</Option> <Option value="disabled" disabled>Disabled</Opt...转载 2021-09-14 18:07:55 · 527 阅读 · 0 评论 -
antd-design 3.x checkBox.Group 选中项数组不受控
博主使用antd-design 3.x checkBox.Group 选中项数组不受控一共有10个选项,例如:鱼香肉丝、爆炒田鸡、茄子肉末...、其他我的目的是当用户选择了其他,清空其他选中项使用Form表单时,即便改变了数据checksList也无法受控因此不使用formItem,使用原始的方式处理(value)即可实现数组、选中项受控:onChange = (checkedValues) => { const { onChangeDrawer, type, form原创 2021-07-23 17:40:20 · 816 阅读 · 0 评论 -
You cannot set a form field before rendering a field associated with the value
在项目中使用antd的Form组件的setFieldsValue方法的时候发现控制台多了一个警告⚠️:You cannot set a form field before rendering a field associated with the value.这句话什么意思呢?在渲染与值关联的字段之前,不能设置表单字段(用有道翻译出来的,其实偷偷告诉你,读了好几遍都没读懂)一开始,我以为是生命周期的问题,根据提示的警告以为是应该在render之后才能赋值,所以,沿着错误的步伐在错误的道路上走的一去不原创 2021-07-19 10:43:49 · 547 阅读 · 0 评论 -
Ant Design3.x中DatePicker 只允许选择年份处理
1、前情提要当初还是antd2.X版本时,DatePicker组件还不支持mode属性,不能单独设置为年份选择器。但是公司项目刚好很多地方都有根据年份做筛选的需求,因为antd不支持,因此,使用了Select组件来实现年份选择。但是,遭到了客户的强烈吐槽,“你们这个UI风格还是要一致撒”,哈哈????,官方吐槽最为致命!没办法了,我自己也没法说服自己了,只能照着antd的UI风格自己撸一个YearPicker咯。(时间选择控件YearPicker基于React,antdwww.cnblogs.com转载 2021-06-23 18:01:57 · 2260 阅读 · 1 评论 -
Umi +ant-design4 proComponent实践demo
创建umi脚手架yarn create @umijs/umi-app安装node_modulesyarn// 每个包都是可以独立按需安装的 也可以yarn add @ant-design安装所有包yarn add @ant-design/pro-form --saveyarn add @ant-design/pro-layout --saveyarn add @ant-design/pro-table --saveyarn add @ant-design/pro-list --save原创 2021-04-29 14:33:15 · 2137 阅读 · 0 评论 -
升级的antd proComponent系列
https://procomponents.ant.design/components/table原创 2021-04-12 14:11:49 · 1449 阅读 · 0 评论