Javascript t弹出窗口上的ymce插入/编辑图像字段在vuetify'内不可编辑（聚焦）；对话

我知道在引导模式下启用tinymce弹出窗口内的焦点所需的调整。 但目前我正在使用vuetify对话框。它似乎没有关注tinymce的弹出字段。

我已经讨论了这个问题，但它在vuetify上下文中不起作用

下面是我的代码，我删除了一些方法只是为了清理，并保留了我在mountedevent&editorinit中尝试过的基本内容

  <no-ssr placeholder="Loading Editor..">
    <tinymce
      id="content"
      :toolbar2="toolbar2"
      :toolbar1="type=='BASIC'?'':toolbar1"
      :plugins="plugins"
      :other_options="other_options"
      v-model="content"
      @input="handleInput"
      v-on:editorInit="initCallBack"
    />
  </no-ssr>
</template>

<script>
//https://dyonir.github.io/vue-tinymce-editor/?en_US
export default {
  props: {
    value: { type: String },
    type: { type: String }
  },
  data() {
    return {
      content: this.value,
      plugins: this.getPlugins(),
      toolbar2: "",
      toolbar1: this.getToolbar1(),
      other_options: {
        menubar: this.getMenubar(),
        height: "320",
        file_browser_callback: this.browseFile,
        auto_focus: '#content'
      }
    };
  },
  mounted(event) {
    // window.tinyMCE.activeEditor.focus();
    // window.tinymce.editors["content"]
    console.log(this.$el, event);
    let list=document.getElementsByClassName("mce-textbox");
    for (let index = 0; index < list.length; ++index) {
    list[index].setAttribute("tabindex", "-1");
}
    //     if ((event.target).closest(".mce-window").length) {
    //     e.stopImmediatePropagation();
    // }
    // this.$refs.refToElement ..$el.focus())
    // this.el.addEventListener('focusin', e => e.stopPropagation());
  },
  methods: {
    handleInput(e) {
      this.$emit("input", this.content);
    },
    initCallBack(e) {
      window.tinymce.editors["content"].setContent(this.value);
      window.tinymce.editors["content"].getBody().focus();
// console.log(this.$refs);
//       const focusable = this.$refs.content.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])')
//         focusable.length && focusable[0].focus()

      document.getElementById("content").addEventListener("onfocusin", console.log("fucssed"));
      // tinymce.activeEditor.fire("focus");

this.$el.querySelector(".mce-tinymce").addEventListener('focusin', e =>{ e.stopImmediatePropagation();console.log('event',e)});

      const element = this.$el.querySelector(".mce-tinymce");
      let _this=this;
      if (element)
        this.$nextTick(() => {
          element.focus();
          console.log("FOCUSED",element,_this);
          // element.stopImmediatePropagation();
        });
      // window.tinyMCE.activeEditor.focus();

      //   console.log(this.$el,e);
      //     if ((e).closest(".mce-window").length) {
      //     e.stopImmediatePropagation();
      // }
    }
};
</script>```


I am using the component : https://github.com/dyonir/vue-tinymce-editor
But fields of the pop are not getting focussed/edited.

//https://dyonir.github.io/vue-tinymce-editor/?en_US
导出默认值{
道具：{
值：{type:String}，
类型：{type:String}
},
数据（）{
返回{
内容：这个值，
plugins:this.getPlugins（），
工具栏2:“，
toolbar1:this.getToolbar1（），
其他选择：{
菜单栏：this.getMenubar（），
高度：“320”，
文件\浏览器\回调：this.browseFile，
自动聚焦：“#内容”
}
};
},
安装（事件）{
//window.tinyMCE.activeEditor.focus（）；
//window.tinymce.editors[“content”]
console.log（这个$el，事件）；
let list=document.getElementsByClassName（“mce文本框”）；
for（让索引=0；索引e.stopPropagation（））；
},
方法：{
手动输入（e）{
this.$emit（“输入”，this.content）；
},
初始化回调（e）{
window.tinymce.editors[“content”].setContent（this.value）；
window.tinymce.editors[“content”].getBody（）.focus（）；
//console.log（这是$refs）；
//const focusable=this.$refs.content.querySelectorAll（'button，[href]，input，select，textarea，[tabindex]：not（[tabindex=“-1”]））
//focusable.length&&focusable[0]。focus（）
document.getElementById（“内容”）.addEventListener（“onfocusin”，console.log（“fucsed”）；
//tinymce.activeEditor.fire（“焦点”）；
这个.el.querySelector（“.mce tinymce”）.addEventListener（'focusin'，e=>{e.stopImmediatePropagation（）；console.log（'event'，e）}）；
常量元素=此.el.querySelector（“.mce tinymce”）；
让_this=this；
if（元素）
这个.$nextTick（（）=>{
元素focus（）；
日志（“聚焦”，元素，_this）；
//元素。stopImmediatePropagation（）；
});
//window.tinyMCE.activeEditor.focus（）；
//console.log（这个$el，e）；
//if（（e）.最近（“.mce窗口”）.长度）{
//e.立即停止传播（）；
// }
}
};
```
我正在使用组件：https://github.com/dyonir/vue-tinymce-editor
但是pop的字段没有得到聚焦/编辑。

修改v-dialog的z索引：

当前：

z-index: 202

已修改：

<style>
.v-dialog__content {z-index: 203 !important;}
</style>

.v-dialog_uu内容{z-index:203！重要；}

---

不要忘记优先考虑样式的重要提示。

从vuetify 2.0开始，有一个新的道具“保留焦点”，您可以将其设置为false以解决上述问题

<v-dialog :retain-focus="false">

默认情况下，选项卡焦点将返回到对话框的第一个子项。当使用需要焦点的外部工具（如TinyMCE或vue剪贴板）时，请禁用此选项

编辑： 以下是保留焦点的链接：

---

接受这个答案，因为它在我的情况下起作用。谢谢！