In the official mentions plugin example for the Lexical.js library, the onSelectOption
callback's reference is stabilized via useCallback
:
const onSelectOption = useCallback(
(
selectedOption: MentionTypeaheadOption,
nodeToReplace: TextNode | null,
closeMenu: () => void
) => {
editor.update(() => {
const mentionNode = $createMentionNode(selectedOption.name);
if (nodeToReplace) {
nodeToReplace.replace(mentionNode);
}
mentionNode.select();
closeMenu();
});
},
[editor]
);
return (
<LexicalTypeaheadMenuPlugin
onSelectOption={onSelectOption}
// ...
/>
)
Does this bear any internal importance/significance? Do I have to do this?