请问如何实现插入内容到光标处

[sunaccess]

Describe the issue

我参照emojis方式，但是选了，选中内容并未出现在编辑框中

 const props = defineProps({
   ......
  onInsert: {
    type: Function as PropType<(generator: InsertContentGenerator) => void>,
    default: () => () => null,
  },
});

        <DropdownToolbar title="emoji" :visible="emostate.visible" @onChange="onEmoChange">
          <template #overlay>
            <div class="emoji-container">
              <ol class="emojis">
                <li
                  v-for="(emoji, index) of emojis"
                  :key="`emoji-${index}`"
                  @click="emojiHandler(emoji)"
                  v-text="emoji"
                ></li>
              </ol>
            </div>
          </template>
          <template #trigger>
            😜
          </template>
        </DropdownToolbar>

const emojiHandler = (emoji: string) => {
  //content.value = content.value + emoji; //更新数据方式，只能加到最好，不是当前光标位置
  const generator: InsertContentGenerator = () => {
    return {
      targetValue: emoji, //此种方式，数据写不到编辑框
      select: true,
      deviationStart: 0,
      deviationEnd: 0,
    };
  };

  props.onInsert(generator);
};
`
```  javascrip
const emojiHandler = (emoji: string) => {
  //content.value = content.value + emoji; //更新数据方式，只能加到最好，不是当前光标位置
  const generator: InsertContentGenerator = () => {
    return {
      targetValue: emoji, //此种方式，数据写不到编辑框
      select: true,
      deviationStart: 0,
      deviationEnd: 0,
    };
  };

  props.onInsert(generator);
};
`

### Procedure version

md-editor-v3 4.17.0

### Reproduction link

_No response_

[imzbf]

参考这个，另外在独立组件中使用DropdownToolbar等，定义接受内置的插入方法是insert

const props = defineProps({
  /**
   * `insert`方法会由编辑器自动向组件的组件注入。
   */
  insert: {
    type: Function as PropType<Insert>,
    default: () => {
      //
    }
  }
});

[sunaccess]

谢谢👍，独立组件问题解决。