最近在做一個表單聯查時候，總是會發現後一個選擇器會記住上一次選擇的值 ，這會導致前一級選擇器已經做出更新後，後一級選擇器卻還記住上一次的操作，

這裏有個方法可以在上級選擇器事件操作時清空Form組件的記錄

this.props.form.resetFields();

整個表單事件

companyChange(value){
    console.log("companyChange--",value);
    this.props.form.resetFields();   //<------就是加在這裏
    let shopsListShopId = {}
    shopsListShopId.companyid 
 
= value;

    this.setState({
        shopsListShopId: shopsListShopId,
    },this.shopsList)
},

<Form layout="inline" onSubmit={this.handleSubmit} autoComplete="off">
    <FormItem>
        {
            getFieldDecorator(‘product_name‘)(
                <Input placeholder="請商品輸入名稱" />
            )
        }
    
 
</FormItem>
    <FormItem>
        {
            getFieldDecorator(‘companyid‘,{
                initialValue: this.state.param && this.state.param.companyid || ‘‘,
            })(
                <Select style={{ width: ‘120px‘ }}
                onChange={this.companyChange}
                
 
>
                    <Option  value=""> --公司名稱-- </Option>
                    {
                        this.state.tableCompanyName && this.state.tableCompanyName.map((item,index) => {
                            return (
                                <Option key={item.id} value={item.id}> {item.title}</Option>
                            )
                        })
                    }
                </Select>
            )
        }
    </FormItem>
    <FormItem>
        {
            getFieldDecorator(‘shopid‘,{
                initialValue: this.state.shopid && this.state.shopid ||‘‘,
            })(
                <Select style={{ width: ‘120px‘ }} >
                    <Option  value=""> --門店名稱-- </Option>
                    {
                        this.state.shopsList && this.state.shopsList.map((item,index) => {
                            return (
                                <Option key={item.id} value={item.id}> {item.title}</Option>
                            )
                        })
                    }
                </Select>
            )
        }
    </FormItem>
    <Button type="primary" htmlType="submit">查詢</Button>
    <Button type="primary" onClick={this.addOrUpdate.bind(this,‘‘)}>添加</Button>
    {/*<Button onClick={this.handleReset}>重置</Button>*/}
</Form>

react 使用Form組件如何清空上一次操作