How do I control the 'editable: boolean' state via a button? #209
Description
How can I control the 'editable: boolean' state in real-time on an HTML page through a button?
Are there any sample codes related to this?
Here is my code, where did I make a mistake?
function App() { const [isEditable, setIsEditable] = useState(true); const editor: BlockNoteEditor | null = useBlockNote({ theme: "light", editable: isEditable, // ... }); const toggleEditable = () => { setIsEditable(!isEditable); } useEffect(() => { console.log(isEditable: ${isEditable}); console.log(editor); }, [isEditable, editor]); // ... return ( <div> <BlockNoteView editor={editor} /> <button onClick={toggleEditable}> {isEditable ? "Lock Editor" : "Unlock Editor"} </button> </div> );