Comments (6)
Hi, @indusee. I have great news, here a left you a Sandbox, where you can see how to use this Undo plugin using react-editor-js into a React class component :
https://codesandbox.io/embed/react-editor-js-v2-forked-kct1je?fontsize=14&hidenavigation=1&theme=dark
// Other imports ...
// Import the Undo library
import Undo from "editorjs-undo";
const ReactEditorJS = createReactEditorJS();
class ReactEditor extends Component {
// Add this constructor
constructor(props) {
super(props);
this.editorCore = React.createRef();
}
// Add these two following functions
handleInitialize = (instance) => {
this.editorCore.current = instance;
};
handleReady = () => {
const editor = this.editorCore.current._editorJS;
new Undo({ editor });
};
// And add the "onInitialize" and "OnReady"
render() {
return (
<ReactEditorJS
onInitialize={this.handleInitialize}
onReady={this.handleReady}
tools={EDITOR_JS_TOOLS}
defaultValue={ ... }
/>
);
}
}
You can see that it is working using the underline and change-case plugins
from editorjs-undo.
Plugins you use with their versions: "@editorjs/underline": "^1.0.0", "editorjs-change-case": "0.0.3", "editorjs-undo": "^2.0.9",
Device, Browser, OS: Dell , Googlecrome Version 106.0.5249.121 (Official Build) (64-bit), Microsoft Windows 10pro, editorjs:ReactEditorJs
from editorjs-undo.
i am getting this error in console
client.js:36 Uncaught (in promise) TypeError: Cannot destructure property 'blocks' of 'editor' as it is undefined.
at new Undo (index.js:33:1)
at onReady (ViewOnBoarding.js:1192:1)
at editor.js:2:1
from editorjs-undo.
Hi, @indusee, I hope you are doing well.
I have been trying to reproduce the error you mentioned.
And, I did undo and redo actions for only text blocks:
And also using the other plugins you mentioned, underline and change-case:
But, I can't get your error. So, please, can you provide us a detailed description with steps to reproduce the error you reported? Or a code sandbox? (https://codesandbox.io/)
Thanks.
from editorjs-undo.
https://codesandbox.io/p/github/indusee/undo-redo_bug/draft/exciting-austin?file=%2Fsrc%2F
(please once run this code, I was tested here undo redo not working for underline plugin, please mention where I did mistake)
from editorjs-undo.
Closing this as the usage instructions for React have been added and released on version 2.0.14
!
from editorjs-undo.
Related Issues (20)
- Add workflow for automatic publishing in npm
- Security Policy violation SECURITY.md HOT 3
- Undo is ignored, when Copy-paste 2-3 paragraph from Wikipedia HOT 1
- Undo does not work in document with initial data HOT 2
- TypeError: can't access property "type", t[i] is undefined in Next.js HOT 3
- Shortcuts are not supported on other keyboard layouts HOT 1
- Add shortcut for Cmd + Shift + Z to redo HOT 3
- Uncaught TypeError: Cannot read properties of undefined (reading 'holder') HOT 3
- Bug when editorjs has set 'paragraph: false' HOT 3
- Save request in read-mode when using multiple editors HOT 1
- Can't undo the deleted block HOT 3
- Undo event handler to trigger undo or redo without keyboard event. HOT 2
- Undo/Redo on German Keyboard Layout not working HOT 1
- Redo action HOT 1
- How do I use api to trigger actions HOT 1
- Undo operation malfunctions when there are line breaks HOT 1
- Can't find variable: regeneratorRuntime HOT 1
- Random bug when undoing HOT 7
- undo functionality doesn't work when splitting text by pressing enter HOT 7
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from editorjs-undo.