Javascript 更改下拉列表选择时显示微调器无效|反应

我有一个下拉列表，其中有一个onChange事件，onChange事件触发2个函数，一个用于设置要显示的微调器的状态，另一个用于联系web服务，并传递回调以隐藏微调器。但是，微调器始终隐藏，并且从未设置为true。这是我的密码：

const Root = (props: IRootProps) => {
    const [displaySpinner, setDisplaySpinner] = React.useState(false)

    const _getOfficeDetails = async (locationId: string, callback?: () => void) => {
        //do something here then call the callback
        callback()
    }

    return (
        <>
                <Dropdown
                    options={utils.getDropDownOptions(offices.map((o => { return { key: o.id, text: o.name } })), "")}
                    selectedKey={officeDetails ? officeDetails.id : 0}
                    onChange={(e, opt) => {
                        setDisplaySpinner(true);
                        _getOfficeDetails(opt.key.toString(), () => setDisplaySpinner(false))
                    }
                    }
                />
                {displaySpinner &&
                    <>
                        <br />
                        <Spinner size={SpinnerSize.large} />
                    </>
                }
        </>
    )
}

constroot=（props:IRootProps）=>{
常量[displaySpinner，setDisplaySpinner]=React.useState（false）
const_getOfficeDetails=async（locationId:string，callback？：（）=>void）=>{
//在这里做点什么，然后调用回调
回调函数（）
}
返回(
{return{key:o.id，text:o.name}}（），“”）}
selectedKey={officeDetails？officeDetails.id:0}
onChange={（e，opt）=>{
setDisplaySpinner（真）；
_getOfficeDetails（opt.key.toString（），（）=>setDisplaySpinner（false））
}
}
/>
{显示微调器&&


}
)
}

---

displaySpinner将始终为false，尽管onChange被触发，断点在setDisplaySpinner上停止。。我从来没见过纺纱机。。我尝试将setTimeout添加5000毫秒，看看它是否能工作，或者它是否快速出现并消失，但相同。有什么想法吗？

看起来您并不是在用微调器等待回调。

setDisplaySpinner

设置为true，并立即更改回false。您希望确保它正在等待异步操作完成。所以我还没有测试过，但这应该可以：

从

onChange

中删除两个

setDisplaySpinner

更新

\u getOfficeDetails

，如下所示：

const_getOfficeDetails=async（locationId:string，callback？：（）=>void）=>{ setDisplaySpinner（真）； //在这里做点什么，然后调用回调 等待回调（）； setDisplaySpinner（假）； } const _getOfficeDetails = async (locationId: string, callback?: () => void) => { setDisplaySpinner(true); //do something here then call the callback await callback(); setDisplaySpinner(false); }