RIP21 / react-simplemde-editor

React wrapper for simplemde (easymde) markdown editor

Home Page:https://react-simplemde-edtior.netlify.com/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

custom actions do not have access to state... kinda

generalleger opened this issue · comments

I am not sure if this is a bug or just my inexperience with react hooks. I've been using class components for a long time, and i am starting a new project and decided (finally) to jump into hooks.

The issue I am encountering is that I have a custom action that triggers after a button is clicked. But, for some reason, the function being called does not have access to the component's state. But if you change a bit of the code, and let it hot reload, the next time you click it does have access to state.

Steps to reproduce

  1. Go to https://codesandbox.io/s/zealous-pasteur-gys689?file=/src/App.js
  2. Open the console
  3. Click the Bold button
  4. Observe that the lineAndCursor returns null
  5. Go to the editor and add some spacing or make any non-breaking change
  6. Click the Bold button
  7. Observe that the lineAndCursor returns a value

Again, I am not sure if this is me still trying to wrap my head around hooks.

For context, I was trying to create a custom dropdown menu with the goal of adding blocks of text when clicked. I eventually figured out that the custom action passes the editor in the callback. So I eventually figured out that I could just editor.codemirror.replaceSelection("sometext");. And that works fine. Regardless, I wanted to report this in case it is helpful. It is just such bizarre behavior that the issue resolves after the hot reload, but not on a fresh pageload.

Sorry for super long response. Have you solved it? Unfortunately Codesandbox is already go, so it's not actionable for me.

I'll close this one for now, but feel free to reopen if it's indeed still broken.