随笔分类 - Ant Design
摘要:关键点: 获取antd组件包裹的原生textArea实例:const textarea = expressInputRef.current.resizableTextArea.textArea; 获取光标位置:const { selectionStart, selectionEnd } =texta
阅读全文
摘要:filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
阅读全文
摘要:1.直接在表单项书写: rules={[ { required: true, message: '请选择指标类型', }, { validator: (_, value) => { const num = form.getFieldValue('itemList')[field.name]['fil
阅读全文
摘要:alertConfig:Form.List的name name:子项中filed的name属性 alarmType:子项内的某一表单项name form.validateFields([['alertConfig', name, 'alarmType']]) 单个List重置表单值: form.re
阅读全文
摘要:行宽为24,可以使用Row和Col来改变布局 const formItemLayout = { labelCol: { span: 3 }, // 控制 label 宽度 wrapperCol: { span: 8 }, // 控制 input 宽度 }; <Form labelAlign="lef
阅读全文
摘要:格式化树数据: function replaceNameWithTitle(data) { // 遍历数据数组 return data.map(item => { // 复制当前对象,以免修改原始数据 const newItem = { ...item }; // 将 name 属性替换为 titl
阅读全文
摘要:核心为onChang事件,赋值需要关注value <Form.Item name='position' label="位置" style={itemStyle} > <InputXYZ /> </Form.Item > const InputXYZ = (props) => { const { id
阅读全文
摘要:<Select allowClear mode="multiple" showArrow={true} showSearch={true} filterOption={(inputValue, option) => option?.props?.label.includes(inputValue)}
阅读全文
摘要:{ dataIndex: 'contractSignDate', key: 'contractSignDate', title: '合同签订日期', width: 120, ellipsis: true, sorter: (a, b) => moment(a?.contractSignDate).v
阅读全文
摘要:注意:current是moment类型的,如需比较 需要将值类型统一后进行比较 const disabledDateStart = useCallback((current) => { if (!contractEndDateValue) { return false } else { return
阅读全文
摘要:// 自定义手机号校验规则 const validatePhone = (_, value) => { const phoneRegex = /^1[3456789]\d{9}$/; if (!value || phoneRegex.test(value)) { return Promise.res
阅读全文