使用React的SweetAlert无法更新jsx文件中表单中输入字段中的值

问题描述

首先，我必须说这是我第一次接触React代码，所以我的问题可能是菜鸟，尝试了几件事，但实际上不知道该怎么办。我正在使用SweetAlert。您可以看到一些示例here。在jsx文件上。

我有以下代码。

handleChange(e) {
    const { name,value } = e.target; //e.target;
    this.setState({ [name]: value });

    console.log("HandleChange: ",e);
    console.log("Target: ",e.target);
    console.log("name: ",name);
    console.log("value: ",value);
}

const editAnswer =(index) => {
    this.setState({
        editAnswerPopup: (
            <SweetAlert
                showCancel
                title={"Edit Answer"}
                onConfirm={() => saveAnswer()}
                onCancel={() => cancelAnswer()}
                type={'controlled'}
                dependencies={[this.state.changeText,this.state.changeValue]}
            >
                <form>
                    <h5>{index}</h5>
                    {AnswerValueValidationError()}
                    {AnswerTextLenghtValidationError()}
                    <input
                        id="changeText"
                        name="changeText"
                        type={'text'}
                        className="form-control"
                        value={this.state.changeText}
                        onChange={this.handleChange.bind(this)}
                        placeholder={'Text'}
                    />
                    <br />
                    <input
                        id="changeValue"
                        name="changeValue"
                        type={'number'}
                        className="form-control"
                        value={this.state.changeValue}
                        onChange={this.handleChange.bind(this)}
                        placeholder={'Value'}
                    />
                </form>
            </SweetAlert>
        )
    });
}

当我按下输入字段之一中的任何键时，handleChange事件会捕获更改，并在控制台中向我显示应该是新值（当前值加上按下的键），但不是反映在行为上，就像输入将被锁定（或者我将进行某些验证，但不允许其更改）。 handleChange事件由其他几个输入字段字段调用，它们按应有的方式正常工作。与这些按钮的唯一区别是，表单位于Sweetalert内部，并且只有在单击特定按钮以编辑内容之前，该组件才会添加到状态/ DOM中，这与页面加载时显示的其他按钮不同。

关于我在做什么错的任何想法？该代码部分取自SweetAlert的最后一个示例。不同之处在于该示例在ts文件中使用了一些额外的代码，而我使用的是jsx。但是对于我对React的理解，我的代码应该可以工作。但是事实并非如此，我想我是在错过一些东西。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

jsx jsx react-redux sweetalert