pro-components icon indicating copy to clipboard operation
pro-components copied to clipboard

🐛[BUG] 在ProForm.Item包裹下使用ReactQuill的时候,每按下一个按键就失去焦点

Open huaiguoguo opened this issue 3 years ago • 0 comments
trafficstars

🐛 bug 描述

在使用 antd 的 ProForm.Item组件包裹ReactQuill富文本组件的时候,每输入一个字母(或者按下一个按键后)就失去焦点

在很多场景下不可避免使用富文本组件,在这方面可否出一个ReactQuill组件和ProForm结合的教程或文档

或者官方出一个富文本组也可以

📷 复现步骤

<ProForm.Group title={'内容部分'} style={{marginTop: '30px'}}>
  <ProForm.Item label={'商品简介'} name={'goods_introduction'} style={{height: '100%'}} rules={[{required: true, message: '请输入商品简介', validator: checkEditor}]}>
    <ReactQuill theme={'snow'}
                    value={value}
                    onChange={handleChange}
                    modules={modulesOptions}
                    style={styleCustomHeight}/>
  </ProForm.Item>
</ProForm.Group>

🏞 期望结果

💻 复现代码

<ProForm.Group title={'内容部分'} style={{marginTop: '30px'}}>
  <ProForm.Item label={'商品简介'} name={'goods_introduction'} style={{height: '100%'}} rules={[{required: true, message: '请输入商品简介', validator: checkEditor}]}>
    <ReactQuill theme={'snow'}
                    value={value}
                    onChange={handleChange}
                    modules={modulesOptions}
                    style={styleCustomHeight}/>
  </ProForm.Item>
</ProForm.Group>

© 版本信息

  • ProComponents 版本: [e.g. 4.0.0] [email protected]
  • Antd 版本: [e.g. 4.0.0] [email protected]
  • umi 版本
  • 浏览器环境 firefox, chrome
  • 开发环境 [e.g. mac OS] win11专业版 22000.795

🚑 其他信息

"dependencies": {
    "@amap/amap-jsapi-loader": "^0.0.3",
    "@ant-design/charts": "^0.9.4",
    "@ant-design/icons": "^4.7.0",
    "@ant-design/pro-descriptions": "^1.6.8",
    "@ant-design/pro-form": "^1.18.3",
    "@ant-design/pro-layout": "^6.15.3",
    "@ant-design/pro-table": "^2.30.8",
    "@antv/data-set": "^0.11.0",
    "@antv/l7": "^2.3.7",
    "@antv/l7-maps": "^2.3.7",
    "@antv/l7-react": "^2.1.9",
    "@types/lodash.debounce": "^4.0.6",
    "@umijs/route-utils": "^1.0.36",
    "ahooks": "^2.0.0",
    "antd": "^4.14.0",
    "bizcharts": "^3.5.3-beta.0",
    "bizcharts-plugin-slider": "^2.1.1-beta.1",
    "classnames": "^2.2.6",
    "gg-editor": "^2.0.2",
    "lodash": "^4.17.11",
    "lodash-decorators": "^6.0.0",
    "moment": "^2.25.3",
    "numeral": "^2.0.6",
    "nzh": "^1.0.3",
    "omit.js": "^2.0.2",
    "react": "^17.0.0",
    "react-dev-inspector": "^1.1.1",
    "react-dom": "^17.0.0",
    "react-fittext": "^1.0.0",
    "react-helmet-async": "^1.0.4",
    "react-quill": "^1.3.5",
    "react-router": "^4.3.1",
    "umi": "^3.5.0",
    "umi-serve": "^1.9.10"
  },

huaiguoguo avatar Jul 18 '22 11:07 huaiguoguo