我有一张显示产品详细信息的产品卡。在底部,有一个 'edit' button。当clicked它显示带有预填充input字段的模式时,可以对其进行编辑然后保存。Modal 也可以在不保存的情况下关闭(但输入字段已编辑)。
我的问题是,当用户编辑字段,然后关闭模式(不保存),然后再次打开时,字段未设置为初始值,但显示已更改。
我尝试了一个具有初始状态的变量,然后在关闭用它填充状态后,但它没有用。也试图对裁判做出反应,没有快乐。
import React, { Component } from 'react'
import Modal from 'react-modal';
const customStyles = {
...
};
Modal.setAppElement('#root');
class AdminButtons extends Component {
state = {
modalIsOpen: false,
}
componentDidMount() {
const { id, inStock, name, price, type } = this.props.product
this.setState({ id, inStock, name, price, type })
}
openModal = () => {
this.setState({ modalIsOpen: true });
}
afterOpenModal = () => {
...
}
closeModal …Run Code Online (Sandbox Code Playgroud)