` elements generated by this component. Typically you'll need to use this to set the height of the Blockly editor, using either an explicit `height` style, flexboxes, or some other means. * `onWorkspaceChange`: A function called every time the content of the workspace changes. It should take a single argument, which is the Blockly workspace object. (You can call methods such as Blockly.JavaScript.workspaceToCode on this object.) * `onXmlChange`: A function called every time the content of the workspace, debounced to be called at most once every 200 milliseconds. This function should take a single argument, which is the new XML generated from the workspace. * `onImportXmlError`: A function called if `initialXml` can't be imported. This function takes a single argument, which is the error thrown during XML import. * `onInject`: A function called after the Blockly workspace is injected. This function takes a single argument, which is the newly-injected Blockly workspace object. This is a good place to add Blockly plugins, if desired. * `onDispose`: A function called after the Blockly workspace is disposed and removed from the page. This function takes a single argument, which is the just-disposed Blockly workspace object. Some Blockly plugins need to use this to dispose their own resources. ### useBlocklyWorkspace `useBlocklyWorkspace(options) -> { workspace, xml }`; #### Options object All properties are optional, except `ref`, which must be passed. * `ref`: **REQUIRED** A React ref object (created via `useRef`) pointing at an HTML element where Blockly will be injected. * `initialXml`: The XML of the program to initially load in the editor. * `workspaceConfiguration`: Any configuration options to be passed into `Blockly.inject` (except for `toolbox`, which is a separate prop). * `toolboxConfiguration`: A JSON toolbox configuration (see [the Blockly documentation](https://developers.google.com/blockly/guides/configure/web/toolbox#json) for details on this format). * `onWorkspaceChange`: A function called every time the content of the workspace changes. It should take a single argument, which is the Blockly workspace object. (You can call methods such as Blockly.JavaScript.workspaceToCode on this object.) * `onImportXmlError`: A function called if `initialXml` can't be imported. This function takes a single argument, which is the error thrown during XML import. * `onInject`: A function called after the Blockly workspace is injected. This function takes a single argument, which is the newly-injected Blockly workspace object. This is a good place to add Blockly plugins, if desired. * `onDispose`: A function called after the Blockly workspace is disposed and removed from the page. This function takes a single argument, which is the just-disposed Blockly workspace object. Some Blockly plugins need to use this to dispose their own resources. #### Hook return value `useBlocklyWorkspace` returns an object containing: * `workspace`: The Blockly workspace object * `xml`: XML generated from the content of the Blockly workspace, debounced to update at most once every 200 milliseconds ## Developer setup for working on this package Clone this repository, and then inside it, do: ```bash yarn install yarn run start ``` webpack-dev-server will start and will be serving a demo of react-blockly, which should automatically refresh if you change the code locally. ## Example usage See `public/index.html` and `src/dev-index.jsx` for a fairly full-fledged demo that shows off most of the features of this component. ## Contributing We accept pull requests and issues! You can file an issue on this project, or fork, modify, and file a pull request. Please note that this project is released with a Contributor Code of Conduct. By participating in this project you agree to abide by its terms. ## Licensing react-blockly is Copyright © 2019-2021 Nat Budin. Distributed under the terms and conditions of the MIT License. react-blockly is based on react-blockly-component, which is Copyright © 2015 PatientsLikeMe, Inc. Distributed under the terms and conditions of the MIT License.

近期下载者：

相关文件：

评论：[我要评论] [举报此文件]

收藏者：