Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Api for setting value from an external change

See original GitHub issue

Do you want to request a feature or report a bug?

Feature request

What’s the current behavior?

There doesn’t appear to be a way to set the editor value externally e.g. from a prop change or other event that would warrant updating the value from outside the editor.


Slate: 0.XX.X Browser: Chrome / Safari / Firefox / Edge OS: Mac / Windows / Linux / iOS / Android

What’s the expected behavior?

We should have a way to set the value externally.

One proposal that has been made is to be able to configure the editor as a controlled component, but there are likely tradeoffs with this. This issue is not intended to champion that particular proposal but rather to discuss what the “right” api might be. e.g. there could be options to call a method on the editor or something more imperative.

NOTE: The idea has been discussed in #3200 of possibly using changes to defaultValue as a way to set the value externally, but the current behavior seems consistent with other uncontrolled components in React.

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Reactions:1
  • Comments:6 (1 by maintainers)

github_iconTop GitHub Comments

ianstormtaylorcommented, Dec 3, 2019

Here’s what the <Slate> component would look like as a controlled component, for those who are interested:

timothyarmescommented, Dec 3, 2019

Yes. I asked Ian on Slack why he chose to go with an uncontrolled component. He said:

I changed it to being an uncontrolled because to me it seemed like the architecture was asking for it for a few reasons…

(a) We’ve always had an onChange handler. And whenever it was called, the editor.value property was already the new value, so re-sending it as a prop was only a little trick to get React to re-render, but the editor itself already had the new value. So on every render pass we’d do editor.value = props.value just to be sure it was the latest

(b) When moving the selection to editor.selection (and paving the way for other non-core tracked properties), we no longer have a single value prop that can be passed in. You’d need to pass in children and selection. And if you use any plugins that extend the editor with other tracked properties, you’d need to pass those in as well

I’m down to try to work around those issues though, if someone wants to take a crack at it We could potentially not special case any prop on <Slate> such that it passed children={children} selection={selection} through just fine But if you also gave it annotations={annotations} it would attach that to the editor too And it could be the one to set the props on the editor instance instead, so that <Editable> didn’t have to do it It means that you’d need to keep a state for selections as well in your top-level component: const [children, setChildren] = useState([]) const [selection, setSelection] = useState(null)

  onChange={editor => {

… (And for any other potential plugin props, but that’s an edge case anyways)

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to set/change Field value from external user action React ...
This can be accomplished by providing a mutators object to the Form component containing the necessary mutators, which will be made ...
Read more >
Change a public or private API endpoint type in API Gateway
Use the API Gateway console to change an API endpoint type · Choose a REST API. · Choose Settings. · Change the Endpoint...
Read more >
How to setup External APIs with Custom Bots?
Following are the steps to setup External APIs in Custom Bots : Select the option 'External API Requests' in the Settings page and...
Read more >
Use change tracking to synchronize data with external systems
Changes made in tables can be tracked using Web API requests by adding the Prefer: odata.track-changes header. This header requests that a delta ......
Read more >
External API Request - Xano Documentation
Params: are the parameters that are passed into the API, these can be Path parameters or Query parameters. Parameters are typically defined with...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Post

No results found

github_iconTop Related Hashnode Post

No results found