amirho/react
1
0
Fork 0
mirror of https://github.com/facebook/react.git synced 2026-02-27 03:07:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

Avoid flashing "Loading..." in right pane

Browse Source
This commit is contained in:
Dan Abramov
2019-03-29 23:58:42 -07:00
parent 61a251f01a
commit b223ec3b39
1 changed files with 11 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/devtools/views/Elements/SelectedElement.js
View File

@@ -30,7 +30,9 @@ export default function SelectedElement(_: Props) {
const element =
selectedElementID !== null ? store.getElementByID(selectedElementID) : null;
const inspectedElement = useInspectedElement(selectedElementID);
const actualInspectedElement = useInspectedElement(selectedElementID);
// The UI lags behind to avoid flashing a loading state.
const inspectedElement = useLastNonNullValue(actualInspectedElement);
const highlightElement = useCallback(() => {
if (element !== null && selectedElementID !== null) {
@@ -284,3 +286,11 @@ function useInspectedElement(id: number | null): InspectedElement | null {
return inspectedElement;
}
function useLastNonNullValue<T>(value: T | null): T | null {
const [lastNonNullValue, setLastNonNullValue] = useState(value);
if (value !== null && value !== lastNonNullValue) {
setLastNonNullValue(value);
}
return lastNonNullValue;
}