示例代码：如下所示

// 二次开发API参考 https://www.shanhaibi.com/docs/v1/tx9rigt2ff6e0m1h/

export class SampleExtension {
  /*
   * 定义属性
   * 如果只想在类内部使用属性变量，不需要将属性变量展示在自定义设置项中，
   * 可以把它设置成 Private 属性，JavaScript 用"#"代表 Private 属性
   * 定义的属性可以使用中文名称
   */
  // #label = "label";

  /**
   * 定义设置项，支持的类型有布尔、字符串、数字、下拉选择框、数据字段、颜色、
   */
  // debug1 = true; //定义一个开关
  // debug2 = ""; //定义一个可输入字符串的输入框（不支持换行）
  // debug3 = 123; //定义一个可输入数字的输入框
  // debug4 = Select.default("A", {
  //   selectChoices: [
  //     { label: "选项A", value: "A" },
  //     { label: "选项B", value: "B" },
  //     { label: "选项C", value: "C" },
  //   ],
  // }); //定义一个下拉框选项
  // debug5 = Field.default(); //定义数据字段, 用于在 '数据-二次开发数据' 中生成字段设置项，以绑定数据
  // debug6 = Color.default(); //定义颜色设置项
  // debug7 = Vector.default([0, 0], {
  //   generics: [
  //     {key: 'x', type: 'int'},
  //     {key: 'y', type: 'int'},
  //   ],
  //   unit: 'px',
  //   columns: 2,
  // }); //定义多维输入框
  // debug8 = Palette.default(["#FFFFFF", "#000000"]); //定义多颜色设置项
  // debug9 = Paragraph.default('段落内容', { rows: 2 }); //定义段落输入框（支持换行）
  // debug10 = Font.default({
  //   //定义默认值
  //   family: '',  size: 12, color: '#fff',
  //   bold: false, italic: false, underline: false,
  // }, {
  //   //定义支持的设置项，不支持会灰掉不能设置
  //   bold: true, italic: true, underline: false,
  // }); //定义字体类型
  // debug11 = Decimal.default(0, {
  //   type: 'int', min: -180, max: 180, step: 1,
  //   unit: '度', showInput: false, inputWidth: 50
  // }); //定义高级数字类型，可支持滑块、单位等
  // debug12 = File.default('', { format: "image|video|.pdf|model|.mp3" }); //定义文件类型，可以选择文件
  // debug13 = Folder.default(); //定义文件夹类型，可选择文件夹
  // debug14 = Element.empty(); //定义组件选择器，可选择其他组件（单选）
  // debug15 = ElementArray.empty(); //定义组件选择器，选择其他组件（多选）

  /**
   * 生命周期函数 当前初始化完成时回调
   * 事件监听通常在这里添加
   * 注意：由于这是其他组件可能还未加载，其他组件的引用在这里可能还是空
   */
  async init() {
    /**
     * 读数据示例
     */
    // //异步读取debug5字段中设置的数据
    // const debug5Data = await this.debug5.readDataAsync({dataFormat: "row"});

    // //读取设置项"axis-value"中设置的数据，读到数据时在callback中处理
    // //通过设置callbackOnDataChanged为true，让数据变化时也回调callback
    // const data = this.element.readData("axis-value", (data)=>{
    //   console.log("data", data);
    //   // process data here
    // }, {dataFormat: "column", callbackOnDataChanged: true});

    // //异步读取设置项"axis-x"和"axis-y"中设置的数据
    // const data2 = await this.element.readDataAsync([["axis-x"], ["axis-y"]], {dataFormat: "object"});

    /**
     * 事件监听示例
     */
    // //监听组件数据变化
    // this.element.addEventListener("data-changed", (ev)=>{
    //   // your code here
    // });

    // //获取组件位置
    // const position = this.element.getOption("position");
    // //监听组件位置变化（注意：只有调用过 getOption 的设置项，才会进入option-changed监听）
    // this.element.addEventListener("option-changed", (ev)=>{
    //   const paths = ev.paths;
    //   // your code here
    // });

    // //监听鼠标点击事件
    // this.element.addEventListener("click", (ev)=>{
    //   // your code here
    // });
    // //监听鼠标移入事件
    // this.element.addEventListener("mouseenter", (ev)=>{
    //   // your code here
    // });
    // //监听鼠标移出事件
    // this.element.addEventListener("mouseleave", (ev)=>{
    //   // your code here
    // });
    // //监听postMessage事件
    // this.element.addEventListener("message", (ev)=>{
    //   const { data, origin, source } = ev;
    //   // your code here
    // });
  }

  /**
   * 生命周期函数 当前组件所在子看板中所有组件初始化完成时回调
   * 其他组件的引用在这里都可以访问了
   */
  ready() {
    this.#currentTime = Date.now();
  }

  /**
   * 生命周期函数 ready后每帧调用，未启用时不会调用
   * 不要在这里放耗时的操作，否则会很卡
   */
  #currentTime = null;
  update() {
    if(this.#currentTime && Date.now() - this.#currentTime >5000){
      this.#currentTime = Date.now();
      this.changeValue();
    }
  }

  #currentValue = 0;
  changeValue() {
    this.element.setOption(
      ["placeholder"],
      this.#currentValue
    );
    this.#currentValue += 100;
    if(this.#currentValue > 2000){
      this.#currentValue = 0;
    }
  }

  /**
   * 生命周期函数 组件销毁时调用，一般在此处清空监听事件
   */
  destroy() {

  }
}

脚本启用后效果如下图所示：

【温馨提示】详细二次开发教程请参考：二次开发入口