随笔分类 - Ant Design
摘要：
Menu菜单如果要做成垂直，需要SubMenu组件的支持，以下是示例代码： import { Menu } from 'antd'; const { SubMenu } = Menu; const BasicVerticalMenu = () => { return ( <div style={{
阅读全文
Menu菜单如果要做成垂直，需要SubMenu组件的支持，以下是示例代码： import { Menu } from 'antd'; const { SubMenu } = Menu; const BasicVerticalMenu = () => { return ( <div style={{
阅读全文
摘要：
问题报错：[React Intl] Missing message: "menu.home.workbench" for locale: "zh-CN", using default message as fallback. Error Component Stack 直翻：[RReact Intl
阅读全文
问题报错：[React Intl] Missing message: "menu.home.workbench" for locale: "zh-CN", using default message as fallback. Error Component Stack 直翻：[RReact Intl
阅读全文
摘要：
.box ::v-deep(.a-isp) { flex: initial; }
阅读全文
.box ::v-deep(.a-isp) { flex: initial; }
阅读全文
摘要：
报错：Module not found: Error: Can't resolve 'ant-design-vue/dist/antd.css' in 'xxx' 原因：引入的antd.css文件实际上应该是reset.css文件，是由于ant-design-vue的官网给的代码和实际下的包的文件不
阅读全文
报错：Module not found: Error: Can't resolve 'ant-design-vue/dist/antd.css' in 'xxx' 原因：引入的antd.css文件实际上应该是reset.css文件，是由于ant-design-vue的官网给的代码和实际下的包的文件不
阅读全文
摘要：
给columns加多一列即可： const columns = [ { title: "序号", key: "index", render: (_, record, index) => index + 1, }, ... ] 如图：
阅读全文
给columns加多一列即可： const columns = [ { title: "序号", key: "index", render: (_, record, index) => index + 1, }, ... ] 如图：
阅读全文
摘要：
前言：以前在做富文本编辑的时候，关于图片裁剪部分使用了antd-img-crop，忘了还有那些可使用的参数，现在上网查找并记录下来吧。 antd-img-crop：一个图片裁剪插件，用于包装antd组件库中的upload组件。 其官网地址在此：https://github.com/nanxiaobe
阅读全文
前言：以前在做富文本编辑的时候，关于图片裁剪部分使用了antd-img-crop，忘了还有那些可使用的参数，现在上网查找并记录下来吧。 antd-img-crop：一个图片裁剪插件，用于包装antd组件库中的upload组件。 其官网地址在此：https://github.com/nanxiaobe
阅读全文
摘要：
<TreeSelect showSearch={true} placeholder="请选择" allowClear treeData={data} filterTreeNode={(inputValue: any, treeNode: any) => { return treeNode.title
阅读全文
<TreeSelect showSearch={true} placeholder="请选择" allowClear treeData={data} filterTreeNode={(inputValue: any, treeNode: any) => { return treeNode.title
阅读全文
摘要：
如图： 问题：table显示的勾选状态的数据无法被改变。 原因：你没有改变到勾选数据，你只是在勾选时把选中的值赋值给了一个变量，然后以为自己清空了变量，以为自然而然地就取消勾选状态了，实际上就是你代码没写全！ 解决方案： 原来写法： rowSelection: { onChange: handleC
阅读全文
如图： 问题：table显示的勾选状态的数据无法被改变。 原因：你没有改变到勾选数据，你只是在勾选时把选中的值赋值给了一个变量，然后以为自己清空了变量，以为自然而然地就取消勾选状态了，实际上就是你代码没写全！ 解决方案： 原来写法： rowSelection: { onChange: handleC
阅读全文
摘要：
react+antd业务代码报错： Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. T
阅读全文
react+antd业务代码报错： Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. T
阅读全文
摘要：
使用:global关键字来改变antd组件的样式，如要改变antd的样式.ant-table-title， 请在.ant-table-title之前再包一层样式，然后在这层样式里面去改变antd的样式就不会影响到其它.ant-table-title： .tableBox { :global { .a
阅读全文
使用:global关键字来改变antd组件的样式，如要改变antd的样式.ant-table-title， 请在.ant-table-title之前再包一层样式，然后在这层样式里面去改变antd的样式就不会影响到其它.ant-table-title： .tableBox { :global { .a
阅读全文
摘要：
今个儿早上测试给我提了个bug，说是modal右上角的关闭图标点击关闭不了，遂阅码，发现onCancel事件没写，只是给footer写了个取消按钮，导致点击关闭按钮时无法触发onCancel事件导致无法关闭 也有的情况就是你modal的open属性不正确
阅读全文
今个儿早上测试给我提了个bug，说是modal右上角的关闭图标点击关闭不了，遂阅码，发现onCancel事件没写，只是给footer写了个取消按钮，导致点击关闭按钮时无法触发onCancel事件导致无法关闭 也有的情况就是你modal的open属性不正确
阅读全文
摘要：
业务中需要用到formly+antd的组件DatePicker日期组件，其中要给该组件添加筛选项（如：全部、昨天、今天），日期的格式化用到了日期插件dayjs（注意不是momentjs） shortcuts = [{text: '全部', onClick: () => ([null,null])},
阅读全文
业务中需要用到formly+antd的组件DatePicker日期组件，其中要给该组件添加筛选项（如：全部、昨天、今天），日期的格式化用到了日期插件dayjs（注意不是momentjs） shortcuts = [{text: '全部', onClick: () => ([null,null])},
阅读全文
摘要：![2023-10-09 antd的表单form可以同时在一个页面出现多个form吗 ==》可以！const [form1] = Form.useForm(); const [form2] = Form.useForm();](https://img2023.cnblogs.com/blog/2823037/202311/2823037-20231122104902588-1441445298.png)
如： const [form1] = Form.useForm(); const [form2] = Form.useForm();
阅读全文
如： const [form1] = Form.useForm(); const [form2] = Form.useForm();
阅读全文
摘要：![2023-10-06 Warning: [antd: Switch] `value` is not a valid prop, do you mean `checked`? ==》 switch组件报错，在form.item添加valuePropName="checked"即可](https://img2023.cnblogs.com/blog/2823037/202311/2823037-20231122105817112-602449508.png)
该报错意思是你用的这个switch组件对应的属性应该是checked而不是value，后者应该是antd默认设置的属性，可以通过valuePropName来手动指定对应的属性值。 如： <FormItem name="status" label="状态" valuePropName="checked
阅读全文
该报错意思是你用的这个switch组件对应的属性应该是checked而不是value，后者应该是antd默认设置的属性，可以通过valuePropName来手动指定对应的属性值。 如： <FormItem name="status" label="状态" valuePropName="checked
阅读全文
摘要：
2021/04/19源代码： <Select placeholder="选择支付方法"> <Option vaule="货币支付">货币支付</Option> <Option vaule="网银支付">网银支付</Option> <Option vaule="积分兑换">积分兑换</Option>
阅读全文
2021/04/19源代码： <Select placeholder="选择支付方法"> <Option vaule="货币支付">货币支付</Option> <Option vaule="网银支付">网银支付</Option> <Option vaule="积分兑换">积分兑换</Option>
阅读全文
摘要：
2021/04/13 子表设置了scroll宽度，为了实现滚动展示效果，但是会超出屏幕宽度，并没有实现滚动，原因：母表没有写scroll来固定x轴宽度，两个表要同时设置才有效。
阅读全文
2021/04/13 子表设置了scroll宽度，为了实现滚动展示效果，但是会超出屏幕宽度，并没有实现滚动，原因：母表没有写scroll来固定x轴宽度，两个表要同时设置才有效。
阅读全文
摘要：
2021/04/13 正在做点击行展示子表数据，存在一个样式问题，就是母表的母的展开图标和多选图标存在较大宽度，通过给columns数组添加了个空对象，那么columns里面的字段的width才生效，然后那个空对象也会去占用100%宽度-其它字段宽度总和的差值。
阅读全文
2021/04/13 正在做点击行展示子表数据，存在一个样式问题，就是母表的母的展开图标和多选图标存在较大宽度，通过给columns数组添加了个空对象，那么columns里面的字段的width才生效，然后那个空对象也会去占用100%宽度-其它字段宽度总和的差值。
阅读全文
摘要：
2021/03/30业务：弹出框里面的form表单里的一个输入框需要点击搜索查询获取数据，如果没有点击搜索则不会影响其他值，但是点击搜索了，其它的输入框就全都初始化成原来的值，不只是输入框，只要包裹在form表单里面的值都会重置；看代码： <Form {...layout} form={form}
阅读全文
2021/03/30业务：弹出框里面的form表单里的一个输入框需要点击搜索查询获取数据，如果没有点击搜索则不会影响其他值，但是点击搜索了，其它的输入框就全都初始化成原来的值，不只是输入框，只要包裹在form表单里面的值都会重置；看代码： <Form {...layout} form={form}
阅读全文
摘要：
2021/03/24input值可以通过被它包裹的form表单取得，有时候会出现没有form表单包裹的情况，就得要去单独获取，请看代码👇1、先初始化一些变量： const [inpValue, setInpValue] = useState(''); // 输入框值2、定义一些方法： // 设置输
阅读全文
2021/03/24input值可以通过被它包裹的form表单取得，有时候会出现没有form表单包裹的情况，就得要去单独获取，请看代码👇1、先初始化一些变量： const [inpValue, setInpValue] = useState(''); // 输入框值2、定义一些方法： // 设置输
阅读全文
浙公网安备 33010602011771号