Javascript 如何在react redux中清除受控窗体

我正在尝试清除react redux组件中的表单。我知道我应该能够在提交后使用setState（）清除它们，但是由于我以道具（通过redux存储）的形式接收所有数据，有没有一种简单的方法可以在组件本身中实现这一点

class Postform extends Component {
    constructor(props){
        super(props)
        this.state={
            propertyName: ' enter name ',
            footage: ' size in sqft ',
            address: ' full address ',
            price: ' $ 00.00 '
        }   
    }

    onChange =(e)=>{
        this.setState({ [e.target.name] :e.target.value});
    }

    onSubmit = (e) =>{
        e.preventDefault()
        const newListing = {
            propertyName: this.state.propertyName,
            footage: this.state.footage,
            address: this.state.address,
            price: this.state.price
        }

        this.props.newProperty(newListing)
// my attempt to reset the state of the form (unsure how to accomplish this?)
        this.setState({
            propertyName: '',
            footage: '',
            address: '',
            price: ''
        })
    };


    render() {
        return (
            <div className="form">
                <h2>Add Listing</h2>
                <form onSubmit = {this.onSubmit}>
                    <div>
                        <label>your listing name</label><br/>
                        <input name="propertyName" type="text" onChange={this.onChange} placeholder={this.state.propertyName} />
                    </div>

                    <div>
                        <label>listing size </label><br/>
                        <input name="footage" onChange={this.onChange} placeholder={this.state.footage} />
                    </div>

                    <div>
                        <label>listing location </label><br/>
                        <input name="address" onChange={this.onChange} placeholder={this.state.address} />
                    </div>

                    <div>
                        <label>desired price </label><br/>
                        <input name="price" onChange={this.onChange} placeholder={this.state.price} />
                    </div>

                    <br/>
                        <button className="submitbtn" type="submit">Submit</button>
                </form>
            </div>
        )
    }
}

Postform.propTypes = {
    newProperty: PropTypes.func.isRequired,
    new: PropTypes.object
}

const mapStateToProps = state =>({
    listings: state.listings.properties,
    new: state.listings.newListing
});

export default connect(mapStateToProps, {newProperty})(Postform)

类后形式扩展组件{
建造师（道具）{
超级（道具）
这个州={
propertyName:“输入名称”，
镜头：“以平方英尺为单位的尺寸”，
地址：'完整地址'，
价格：“$00.00”
}   
}
onChange=（e）=>{
this.setState（{[e.target.name]：e.target.value}）；
}
onSubmit=（e）=>{
e、 预防默认值（）
常量newListing={
propertyName:this.state.propertyName，
镜头：这个州，镜头，
地址：this.state.address，
价格：这个。州。价格
}
this.props.newProperty（newListing）
//我试图重置窗体的状态（不确定如何完成此操作？）
这是我的国家({
propertyName:“”，
镜头：''，
地址：''，
价格：''
})
};
render（）{
返回(
添加列表
您的登录名

列表大小

列表位置

期望价格



提交
)
}
}
Postform.propTypes={
newProperty:PropTypes.func.isRequired，
新：PropTypes.object
}
常量mapStateToProps=状态=>({
列表：state.listings.properties，
新建：state.listings.newListing
});
导出默认连接（mapStateToProps，{newProperty}）（Postform）

我在网上查了一下，找到了一些解决办法。我想看看是否有人可以根据我的代码告诉我是否有更好的方法来实现这一点

---

在这里，根据我的组件，我发现所有不同的方法都不确定应该使用哪种方法：

你的方法对我来说似乎有效，我只会以一种有点“懒惰”的方式来做这项工作：

this.setState(Object.keys(this.state).forEach(key => this.state[key] = ''))

---

请为您的代码专用答案添加一些指导，谢谢。

import { initialize, reset } from 'redux-form';    
dispatch(initialize('formName', {})); // Clear form

// or 

dispatch(reset('formName'));