1

I tried to get updated string from editor, but not getting last character from editor. I tried on blur, onchange also but not getting.

output

import React from 'react';import 'jodit';import JoditEditor from "jodit-react";import "../src/JoditEditors.css"class JoditEditors extends React.Component {constructor(props) {
super(props);
this.state = {
     
    test: 'content',

};}componentDidUpdate() {
}componentDidMount() {}updateContent = (value) => {
   this.setState({ test: value })
console.log(this.state.test);}newsetContent = (dds) => {
console.log(dds);}shoot() {
this.updateContent();
console.log(this.state.test);}jodit;setRef = jodit => this.jodit = jodit;config = {readonly: false}render() {
return (
    <div>
    <JoditEditor
        editorRef={this.setRef}
            value={this.state.test}
            config={this.config}
            //onBlur={newContent => this.newsetContent(newContent)} 
           // onBlur={() => this.newsetContent(this.state.test)}
            onChange={this.updateContent}
    />
        <button onClick={() => { this.shoot() }} >Take the shot!</button>
        </div>
);    }}export default JoditEditors;
chaitanya
  • 115
  • 1
  • 8
  • If you're using React 16 or later, you want `onChange={evt => this.updateContent(evt)}` at the very least, because `this` is _not_ preserved automatically (unlike in React 15 and earlier), just like you're already doing for `onBlur`. – Mike 'Pomax' Kamermans Sep 30 '20 at 04:42
  • @Mike'Pomax'Kamermans i tried onChange={evt => this.updateContent(evt)} this one also but not working. Again last character is missing in onchange & button click also – chaitanya Sep 30 '20 at 04:45
  • It won't fix this specific problem, but you _do_ need to fix that. Did you remember to check https://github.com/jodit/jodit-react, and if their docs didn't address this, did you file an issue for them to be aware of the fact that their project might have a bug? – Mike 'Pomax' Kamermans Sep 30 '20 at 04:45
  • @Mike'Pomax'Kamermans yeah i tried all ways, then only i raised a request in this stack overflow for help – chaitanya Sep 30 '20 at 04:47
  • @Mike'Pomax'Kamermans how can i fix this issue – chaitanya Sep 30 '20 at 04:47
  • Are you using those `console.log` calls as evidence for this issue? Or is there something else that indicates the issue as well? – Henry Woody Sep 30 '20 at 05:51
  • @HenryWoody yes, console log is my evidence, i attached that screenshot also. plz see once and help on this – chaitanya Sep 30 '20 at 06:03
  • Does this answer your question? [setState doesn't update the state immediately](https://stackoverflow.com/questions/41278385/setstate-doesnt-update-the-state-immediately) – Henry Woody Sep 30 '20 at 06:08
  • @HenryWoody i tried above link also, but not working – chaitanya Sep 30 '20 at 06:16
  • The point is not to do anything differently but to recognize that state updates are not reflected immediately, so when you log your variable right after calling `setState`, the changes will not be shown. If you use the variable in another method, it should be updated correctly (for example add a button that just logs `state.test` when clicked, and you should see it). – Henry Woody Sep 30 '20 at 06:18
  • @HenryWoody i already added button also, for testing purpose also, when i click on button i am NOT getting last character & onchange is not firing also. please see above button click code also – chaitanya Sep 30 '20 at 06:28
  • Can you please accept answer id you found it helpfull? – adir abargil Dec 02 '20 at 05:49

1 Answers1

1

you console it before the next render so the state isn't really updated yet... this will indicate the real state:

updateContent = (value) => {
    this.setState({ test: value },()=>{
        console.log(this.state.test);
    })
} 
adir abargil
  • 5,495
  • 3
  • 19
  • 29
  • can u be more specific? – adir abargil Sep 30 '20 at 09:39
  • tried above type of set-state function but comes to console its not updating last character. Whatever text comes in Value same text details displaying. Last character is not updating in Value itself – chaitanya Sep 30 '20 at 09:51
  • it seems like the problem then comes from inside the `JoditEditor` can you make a code sandbox? – adir abargil Sep 30 '20 at 09:52
  • Please use this link: Enter some dummy text & see the console parallelly, Thank you for help https://stackblitz.com/edit/react-b8pww5?file=src%2FExample.js – chaitanya Sep 30 '20 at 10:21
  • Note that this isn't actually an answer, though. If the original code worked fine and the issue is that _only_ console.log is used, instead of _actually rendering based on the onChange value_, then that should be a comment to the question. – Mike 'Pomax' Kamermans Sep 30 '20 at 14:49