相关疑难解决方法(0)

Ant Design 重置选择

我有2个<Select>。第二个中的值取决于在第一个上所做的选择。当我在第一个更改所选项目时,第二个更新的可用选项。但是,如果我已经在第二个选项中进行了选择,那么即使根据对第一个选择的更改它不应该可用,该选项也会保持选中状态。

当对第一个选择进行更改时,如何将第二个选择重置为不选择任何内容?

第一选择:

<FormItem {...formTailLayout}>
    <FormTitle>Operation</FormTitle>
    {getFieldDecorator('Operation', {
    rules: [
        {
        required: true
        }
    ]
    })(
    <Select
        showSearch
        placeholder="Select an option"
        onChange={this.handleOperationChange}
    >
        {operations.map(operation => (
        <Option value={operation.operation_id}>
            {operation.operation_name}
        </Option>
        ))}
    </Select>
    )}
</FormItem>
Run Code Online (Sandbox Code Playgroud)

第二选择:

<FormItem {...formTailLayout}>
    <FormTitle>Metric</FormTitle>
    {getFieldDecorator('Metric', {
    rules: [
        {
        required: true
        }
    ]
    })(
    <Select
        showSearch
        placeholder="Select an operation first"
        onChange={this.handleMetricChange}
    >
        {matrics
        .filter(
            metric => metric.operation_fk === operation_fk
        )
        .map(metric => (
            <Option value={metric.metric_name}>
            {metric.metric_name}
            </Option>
        ))}
    </Select>
    )}
</FormItem>
Run Code Online (Sandbox Code Playgroud)

javascript reactjs antd

7
推荐指数
1
解决办法
9949
查看次数

标签 统计

antd ×1

javascript ×1

reactjs ×1