是否有一种方法可以在React选择中获得当前价值，请选择如果未启动Onchange事件

Question

我在反应选择的组件中添加了我的代码中，我将在选项prop和on Change回调中传递，以获取那里的值。我需要做的是，当用户按下将整个表单重置回其原始状态时，可以将其重置为null。这就是为什么我觉得我需要一种访问选择的当前值，以便将其设置回null。

我试图将REF Prop传递给SELECT以获取当前值，并在控制台中看到CurrentValue和Value被设置为未定义时，当我选择"退出"按钮时。

                                    <Select
                                        title={'List'}
                                        options={createListOptions}
                                        ref={listSelectRef}
                                        closeMenuOnSelect={true}
                                        filterOption={createFilter({
                                            matchFrom: 'start',
                                        })}
                                        isRequired
                                        value={listId}
                                        onChange={value => {
                                            setListIds(value);
                                            setListError(false);
                                        }}
                                        error={listError}
                                    />
                                </div>```

Answer 1

在单击按钮上，您可以使用ref，

获得所选值

<Select defaultValue={options[1]} options={options} ref={this.listSelectRef}/>
<button onClick={this.getVal}>Get Value</button>

此处使用defaultValue用于初始值，因此我们可以检查而不更改选择值如何获得已选择的值。

，您的功能应该是

getVal = () =>{
    console.log(this.listSelectRef.current.state.value);  //this will give you selected option object
    console.log(this.listSelectRef.current.state.value.value); // this will give you value
    console.log(this.listSelectRef.current.state.value.label); //this will give you label which is actually shown on front end
}

demo

Answer 2

我认为您应该尝试此