同一个页面创建多个编辑器，自定义按钮只会在最后一个编辑器创建。

[LiuXIn011]

代码：

<template>
  <div>
    <vue-ueditor-wrap
    v-model="msg"
    editor-id="custom-btn-demo-01"
    :config="editorConfig"
    @before-init="addCustomButton"
  ></vue-ueditor-wrap>
  <vue-ueditor-wrap
    v-model="msg"
    :config="editorConfig"
    editor-id="custom-btn-demo-02"
    @before-init="addCustomButton"
  ></vue-ueditor-wrap>
  </div>
</template>

<script>
import VueUeditorWrap from 'vue-ueditor-wrap'
export default {
  components: {
    VueUeditorWrap
  },
  data() {
    return {
      msg: '',
      editorConfig:{}
    };
  },
  created() {
    // 这里根据你项目的具体情况设置，我这么设置是针对这个文档网站的
    this.UEDITOR_HOME_URL = '/UEditor/';
    this.editorConfig = {
      UEDITOR_HOME_URL: this.UEDITOR_HOME_URL,
      listiconpath: `${this.UEDITOR_HOME_URL}listicon/`,
    };
    
  },
  methods: {
    addCustomButton(editorId) {
      window.UE.registerUI(
        'simpleupload',
        (editor, uiName) => {
          // 创建一个 button
          const btn = new window.UE.ui.Button({
            // 按钮的名字
            name: uiName,
            // 提示
            title: '鼠标悬停时的提示文字',
            // 需要添加的额外样式，可指定 icon 图标
            cssRules: '',
            // 点击时执行的命令
            onclick() {
              // 这里可以不用执行命令，做你自己的操作也可
              console.log(13);
            },
          })
          // 因为你是添加 button，所以需要返回这个 button
          return btn;
        },
        undefined /* 指定添加到工具栏上的哪个位置，默认时追加到最后 */,
        editorId /* 指定这个 UI 是哪个编辑器实例上的，默认是页面上所有的编辑器都会添加这个按钮 */
      );
    },
  },
};
</script>

[LiuXIn011]

按钮名称重复