Uncaught Erreur: récipient se trouve pas dans le document courant

Question

use blocky in React.js ,the question about the Blockly.inject

import React from 'react' 
import Blockly from 'node-blockly' 
const toolbox = ` 
    <xml> 
     <block type="controls_if"></block> 
     <block type="controls_whileUntil"></block> 
    </xml>` 
class BlocklyDiv extends React.Component { 
    componentDidMount() { 
     var workspace = Blockly.inject(this.blocklyDiv,{toolbox: toolbox}); 
    } 
render() { 
    return (
     <div> 
      <h2>BlocklyDiv</h2> 
      <div id="blocklyContainer"> 
       <div id="blocklyDiv" ref={ref => this.blocklyDiv = ref} ></div> 
      </div> 
     </div> 
     ) 
    } 
} 
export default BlocklyDiv 

the error : Uncaught Error: container is not in current document.

enter image description here

Answer 1

Le rappel ref est effectivement le componentDidMount pour cet élément JSX.

Déplacez la logique hors de componentDidMount et dans le rappel ref à la place.