使用內建程序方塊

使用外掛程式

如要使用程序區塊,建議使用 @blockly/block-shareable-procedures 外掛程式。如要瞭解外掛程式區塊和內建區塊的差異,請參閱總覽

安裝

Yarn: shell yarn add @blockly/block-shareable-procedures

NPM: shell npm install @blockly/block-shareable-procedures

用量

import Blockly from 'blockly';
import {blocks, unregisterProcedureBlocks} '@blockly/block-shareable-procedures';

unregisterProcedureBlocks();
Blockly.common.defineBlocks(blocks);

這會定義與舊版內建程序區塊同名的程序區塊。因此,如果您載入以舊程序方塊儲存的 JSON 或 XML,這些檔案仍會繼續正常載入。

將其新增至工具箱

定義好區塊後 (外掛程式或舊版內建區塊),您需要讓使用者能夠使用這些區塊。這需要使用類別樣式工具箱,因為程序類別是動態填入,而飛出式工具箱不支援這項功能。

您可以將動態類別新增至工具箱,如下所示:

JSON

{
  "kind": "categoryToolbox",
  "contents": [
    {
      "kind": "category",
      "name": "Functions",
      "custom": "PROCEDURE"
    }
  ]
};

XML

<xml id="toolbox" style="display: none">
  <category name="Functions" custom="PROCEDURE">
</xml>