froala - 当 emojionearea 在同一个编辑器上组合时，at.js 在 fraola 编辑器上不起作用

Question

我想用 froala 编辑器 textarea 添加 emojione 和 at.js（自动完成）。emojione 工作正常，但 at.js 不起作用。

版本：froala_editor v3.1.0 EmojioneArea v3.1.5 at.js - 1.5.3

这是我的片段：

// Define data source for At.JS.
var datasource = ["Jacob", "Isabella", "Ethan", "Emma", "Michael", "Olivia" ];

// Build data to be used in At.JS config.
var names = $.map(datasource, function (value, i) {
  return {
    'id': i, 'name': value, 'email': value + "@email.com"
  };
});

// Define config for At.JS.
var config = {
  at: "@",
  data: names,
  displayTpl: '<li>${name} <small>${email}</small></li>',
  limit: 200
}

$('#froala-editor').emojioneArea({
                                autocomplete: false,
                                pickerPosition: "top",
                                tonesStyle: "bullet",
                                saveEmojisAs: "unicode"
                            });

// Initialize editor.
$('#froala-editor')
  .on('froalaEditor.initialized', function (e, editor) {
    editor.$el.atwho(config);

    editor.events.on('keydown', function (e) {
      if (e.which == $.FroalaEditor.KEYCODE.ENTER && editor.$el.atwho('isSelecting')) {
        return false;
      }
    }, true);
  })
  .froalaEditor()

<div id="froala-editor">
</div>

Answer 1

看起来您正在使用 V2 语法来初始化 Froala。尝试像这样初始化它：

// Initialize editor.
var editor = new FroalaEditor('#froala-editor', {
    events: {
      initialized: function() {
        $(editor.el).atwho(config);

    editor.events.on('keydown', function (e) {
      if (e.which == FroalaEditor.KEYCODE.ENTER && $(editor.el).atwho('isSelecting')) {
        return false;
      }
    }, true);      }
    }
  });