- I added code to blockly-react/src/App.js to use
this.setState
:
constructor(props) {
super(props);
this.state = {code: ""};
}
generateCode = () => {
var code = BlocklyJS.workspaceToCode(this.simpleWorkspace.workspace);
console.log(code);
this.setState({code: code});
}
....
And used this.state.code in the render:
<div><h2>Code</h2><code><pre>{this.state.code}</pre></code></div>
This broke the app with the error that the Blockly component's render returned null. (See below)
Add
shouldComponentUpdate() {return false}
to blockly-react/src/Blockly/BlocklyComponent.jsx
Is this the right fix?
Uncaught Invariant Violation: BlocklyComponent(...):
Nothing was returned from render.
This usually means a return statement is missing. Or, to render nothing, return null.
at http://localhost:3000/static/js/0.chunk.js:50494:40
at reconcileChildFibers (http://localhost:3000/static/js/0.chunk.js:50497:19)
at reconcileChildren (http://localhost:3000/static/js/0.chunk.js:52610:32)
at finishClassComponent (http://localhost:3000/static/js/0.chunk.js:52991:9)
at updateClassComponent (http://localhost:3000/static/js/0.chunk.js:52926:28)
at beginWork$1 (http://localhost:3000/static/js/0.chunk.js:54527:20)
at HTMLUnknownElement.callCallback (http://localhost:3000/static/js/0.chunk.js:35509:18)
at Object.invokeGuardedCallbackDev (http://localhost:3000/static/js/0.chunk.js:35558:20)
at invokeGuardedCallback (http://localhost:3000/static/js/0.chunk.js:35612:35)
at beginWork$$1 (http://localhost:3000/static/js/0.chunk.js:59716:11)
at performUnitOfWork (http://localhost:3000/static/js/0.chunk.js:58648:16)
at workLoopSync (http://localhost:3000/static/js/0.chunk.js:58626:26)
at renderRoot (http://localhost:3000/static/js/0.chunk.js:58301:15)
at runRootCallback (http://localhost:3000/static/js/0.chunk.js:57955:24)
at http://localhost:3000/static/js/0.chunk.js:47032:28
at unstable_runWithPriority (http://localhost:3000/static/js/0.chunk.js:67259:16)
at runWithPriority$2 (http://localhost:3000/static/js/0.chunk.js:46980:14)
at flushSyncCallbackQueueImpl (http://localhost:3000/static/js/0.chunk.js:47027:11)
at flushSyncCallbackQueue (http://localhost:3000/static/js/0.chunk.js:47015:7)
at discreteUpdates$1 (http://localhost:3000/static/js/0.chunk.js:58087:11)
at discreteUpdates (http://localhost:3000/static/js/0.chunk.js:37586:16)
at dispatchDiscreteEvent (http://localhost:3000/static/js/0.chunk.js:41400:7)
index.js:1375 The above error occurred in the <BlocklyComponent> component:
in BlocklyComponent (at App.js:55)
in header (at App.js:52)
in div (at App.js:51)
in App (at src/index.js:7)