Slate: Can't call `setValue` on Editor React component

Created on 26 Mar 2019  路  7Comments  路  Source: ianstormtaylor/slate

Do you want to request a _feature_ or report a _bug_?

BUG

What's the current behavior?

Editor react component instance is missing the setValue method.
In plugin event handler, I can't call editor.setValue as it's undefined.

What's the expected behavior?

Editor react component instance has the setValue method.
It should be possible to call editor.setValue from plugin event handler.

question

Most helpful comment

Hey, this is by design because setValue is an internal-type method for setting things up. Event handlers should not be calling editor.setValue and should instead be using operations to achieve this.

All 7 comments

Hey! I believe the Editor React component is meant to be used as a totally uncontrolled component (where there's an initial state and then you can read the state out), or as a controlled component (where there's a value prop and an onChange prop, and the parent is expected to store the value in state and re-render the Editor.) It sounds like you need to use the latter approach. There's no need for a setValue method because you can re-render the Editor component with the updated value, eg: <Editor value={newValue} />.

While that is technically true, any plugins that have event handlers don't have access to the actual Editor controller then. If I log the editor prop in say onKeyDown handler, I can't call editor.setValue as it's undefined.

Slate needs more docs on how to utilize the Editor in an _uncontrolled_ way, without having to deal with handling 1000s of state transitions. I'm looking for something like setValue (and getValue?) as well since it's mentioned in the docs, but when I try to access it from the Editor ref it's undefined.

@neutraali FYI, Slate core Editor and React Editor component are two different things, that's why you see Editor both under SLATE CORE and SLATE REACT sections in documentation sidebar.

React component doesn't have setValue but it does have a reference to core (ref.controller) which has setValue.

Maybe you should ask around in Slate Slack. I've done several complex editors, including collaboration and I've never needed to use this API/controller directly. Maybe there's a less imperative/frustrating way.

@adjourn Have you considered open sourcing an editor, especially one with collaboration? It would be enourmously helpful for people trying to learn Slate since most examples out there are pretty basic.

Hey, this is by design because setValue is an internal-type method for setting things up. Event handlers should not be calling editor.setValue and should instead be using operations to achieve this.

@alangibson I see you've already STAR'd this. I made that project just to show how easy it can be. All the _TODO_ features in README are _quite easy_ to add and were already planned in my head when I wrote it.

I stopped because I had other stuff to do and most of these features are business and/or storage layer specific but I could continue working on it if there's more interest.

Was this page helpful?
0 / 5 - 0 ratings