如何重置选择字段 onChange

问题描述

我有一个下拉选择组件，它由从一组按钮中选择的内容填充。在从按钮列表中进行选择之前，下拉列表没有选择。但是我创建了一个问题，如果选择一个按钮然后选择另一个按钮，即使该项目不应该出现在下拉列表中的选项列表中，下拉列表仍然保留上一个选择的值。我正在想办法重置或清除选择：

const [location,setLocation] = useState("");
const [thvchecked,setThvChecked] = useState(false);
const [pvchecked,setPvChecked] = useState(false);
const [osvchecked,setosvChecked] = useState(false);

let emCodeOptions = [];
if (location === "telehealthVisit") {
      emCodeOptions = telehealthVisitEMCode;
    } else if (location === "telephoneVisit") {
      emCodeOptions = telephoneVisitEMCodeChoices;
    } else if (location === "onSiteVisit") {
      emCodeOptions = onSiteVisitEMCodeChoices;
    } else {
      emCodeOptions = [];
    }

const handleEMCodeChange = (selected) => {
    props.onUpdate("emCode",selected.value);
  };

const onLocationSelection = (event) => {
    let loc = event.target.name;

    if (loc === "telehealthVisit") {
      setLocation("");
      setThvChecked(!thvchecked);
      props.onUpdate("visitLocation",loc);
    } else if (loc === "telephoneVisit") {
      setLocation("");
      setPvChecked(!pvchecked);
      props.onUpdate("visitLocation",loc);
    } else if (loc === "onSiteVisit") {
      setLocation("");
      setosvChecked(!osvchecked);
      props.onUpdate("visitLocation",loc);
    }

   setLocation(loc);
  };

我虽然可以通过重置 onLocationSlection 函数中的状态来实现此目的，但这似乎在我第一次更改选择后不起作用。

解决方法

React 不会在每次设置位置时调用 render 方法。它将累积值并使用最后一个值巧妙地调用渲染。所以 setLocation 到 '' 并没有达到预期的效果。

这段代码在我看来在逻辑上是正确的。您是否在其他地方更新数组 telehealthVisitEMCode、telephoneVisitEMCodeChoices？