0

我最近从 tinymce 4 迁移到 tinymce 5，我无法弄清楚如何创建一个像按钮这样的下拉菜单并根据当前选择更改其文本。

基本上，我想要一些类似默认字体或标题按钮的东西。

这是我创建一个下拉按钮的方法，该按钮将使用<span lang='xx'标签包装选定的文本。

addLanguageBtn()
{
    let lngBtn = editor.ui.registry.addMenuButton('languageBtn', {
      text: 'Language',

      fetch: (callback) => {
        let items: any = [
          {text: 'French', value: 'fr', type: 'menuitem'},
          {text: 'German', value: 'de', type: 'menuitem'},
          {text: 'Spanish', value: 'es', type: 'menuitem'},
        ];
        
        items.forEach(item => {

          item.onAction = () => {

            let currentNode = editor.selection.getNode();

            if (currentNode.tagName.toLocaleLowerCase() !== 'body')
            {
              currentNode.setAttribute('lang', item.value);
            }
            else
            {
              let textToWrap = editor.selection.getContent();
              let wrappedContent = `<span lang='${item.value}'>${textToWrap}</span>`;
              editor.selection.setContent(wrappedContent);
            }
          }

        });

        callback(items);

      },

在tinymce的主要方法中，每当光标放在标签setup内的单词上时，我想将该按钮的文本更改为所选语言<span lang='xx'

  setup(ed)
  {
      
    let lngButton = this.addLanguageBtn(ed);


    ed.on('NodeChange', function (ev) {
      if (!lngButton)//No button
      {
        return;
      }
      let lang = ev.element.getAttribute('lang');
      lngButton.text = lang; // <==== This does not work, value is modified but UI is not updated

笔记

这是一个代码笔示例

编辑：我查看了 tinymce 的源代码，据我所知，他们使用 Alloy 组件创建自己的字体系列和字体粗细按钮。我只是在寻找“简单”的东西。

4

1 回答 1

2

不确定是否有任何直接的方法可以实现这一点，因为在项目的存储库中已经存在与您相同要求的问题。

这是该项目的一位贡献者的回复：

抱歉，目前无法做到这一点，因为允许这样做的按钮（例如 fontselect）当前使用仅限内部的 API。我们确实希望将其公开以供其他人使用，但是我们尚未安排工作来执行此操作，因此我将其标记为功能请求。

注意：如果您是商业客户，我建议您通过我们的支持渠道记录此功能请求，因为它会比 GitHub 功能请求获得更多关注/优先级。

于 2020-09-10T04:20:05.837 回答