首页 > 解决方案 > 触发 onChange 时 Ant 设计的可编辑段落值变为空

问题描述

import {Typography} from 'antd'
const {Paragraph} = Typography

const [value, setValue] = useState("This is initial value");
const onChangeEdit = editVal => {
    setValue(editVal);
};

<Paragraph editable={{ onChange: onChangeEdit }}> {value} </Paragraph>

我对上面的代码有疑问。

在此处输入图像描述

最初,段落将“这是初始值”作为初始值。因此,如果我开始编辑,它应该具有“这是初始值”作为初始值。

但是每当我单击编辑图标时,输入框就会变为空而不是初始值。

解决此问题的解决方案是什么?

标签: reactjsformsantdparagraphtypography

解决方案


我解决了这个问题!首先,在 index.js 上包含 antd 的 css

import "antd/dist/antd.css";

然后去掉组件内部的空格<Paragraph>,应该是:

<Paragraph editable={{ onChange: onChange }}>{value}</Paragraph>

是工作链接


推荐阅读