diff options
Diffstat (limited to 'src/components/PollsList')
-rw-r--r-- | src/components/PollsList/PollsList.tsx | 1 | ||||
-rw-r--r-- | src/components/PollsList/RenderItem.tsx | 9 |
2 files changed, 5 insertions, 5 deletions
diff --git a/src/components/PollsList/PollsList.tsx b/src/components/PollsList/PollsList.tsx index 62273ef..41f9966 100644 --- a/src/components/PollsList/PollsList.tsx +++ b/src/components/PollsList/PollsList.tsx @@ -16,6 +16,7 @@ const PollsList: React.FC<PropTypes> = ({ polls, mutate }) => { index={index} style={style} key={key} + _key={key} /> ), [polls, mutate]); diff --git a/src/components/PollsList/RenderItem.tsx b/src/components/PollsList/RenderItem.tsx index 900dae6..5123bca 100644 --- a/src/components/PollsList/RenderItem.tsx +++ b/src/components/PollsList/RenderItem.tsx @@ -8,11 +8,11 @@ interface PropTypes { mutate: (polls: Poll[], refetch: boolean) => void; index: number; style: React.CSSProperties; - key: string; + _key: string; // https://reactjs.org/warnings/special-props.html } const compareProps = (oldProps: PropTypes, newProps: PropTypes) => { - if (oldProps.key !== newProps.key) return false; + if (oldProps._key !== newProps._key) return false; if (oldProps.index !== newProps.index) return false; if (oldProps.polls !== newProps.polls) return false; // TODO: uncomment line below to listen to style updates @@ -21,7 +21,7 @@ const compareProps = (oldProps: PropTypes, newProps: PropTypes) => { }; const RenderItem: React.FC<PropTypes> = React.memo(({ - polls, mutate, index, style, key + polls, mutate, index, style, _key }) => { const poll = polls[index]; @@ -35,8 +35,7 @@ const RenderItem: React.FC<PropTypes> = React.memo(({ }, [mutate, index, polls]); return ( - // To re-render on list resize, add this info to key - <div key={`${key}-${poll._id}-${polls.length}`} style={style}> + <div key={_key} style={style}> <PollCard poll={poll} setPoll={setPoll} /> </div> ); |