1

我正在使用 Recoil 来跟踪用户打开的最后选择的手风琴。根据动态生成的工作流程，在页面上呈现的手风琴数量可以在 10 到 250 个手风琴之间变化。

我想知道是否有人知道如何在不触发重新渲染的情况下更新 Recoil atom。如果我使用 useRecoilCallback 更新 Recoil 状态，那么在性能良好的设备上，它仍然需要大约 1 秒或更长时间来注册我的点击并随着渲染进行更改。如果我在设置时删除 Recoil 状态，它会立即呈现并注册点击。

我想知道是否有办法在不导致渲染的情况下更新 SelectedCategories 原子。这些手风琴中的每一个都有 15 多个额外的手风琴组件，当我切换一个时，每个手风琴及其子手风琴都会重新渲染。

const SelectedCategories = useRecoilCallback(({ snapshot }) => () => snapshot.getLoadable(_SelectedCategories).contents, [Inspection.id]);
const setSelectedCategories = useRecoilCallback(({ set }) => (n) => {
    set(_SelectedCategories, n);
  }, []);

const openAccordion = () => {
  let usc = JSON.parse(JSON.stringify(SelectedCategories()));
  usc.category = usc.category === propKey ? '' : propKey;
  setSelectedCategories(usc);
}


<Accordion defaultExpanded={SelectedCategories.contents?.category === propKey || false} id={propKey}>
  <AccordionSummary onClick={openAccordion}>
  { /* Accordion Summary Header */ }
  </AccordionSummary>
  <AccordionDetails>
  { /* Accordion Details Here */ }    
  </AccordionDetails>
</Accordion>
4

0 回答 0