带有Trix编辑器的At.js :错误“给定的范围不在文档中”。

// 创建Trix编辑器实例
var editor = new Trix.Editor(document.getElementById('editor'));

// 创建At.js实例
var at = new AtJS({
  at: '@',
  data: ['user1', 'user2', 'user3'], // 用户数据，可以从后端获取
  displayTpl: '<li>${name}</li>', // 显示模板
  insertTpl: '@${name}', // 插入模板
  limit: 5, // 最多显示的匹配项数量
  startWithSpace: true // 是否需要在@之前输入空格才触发匹配
});

// 监听Trix编辑器的input事件，在输入时触发@提及匹配
editor.addEventListener('input', function() {
  var range = editor.getSelectedRange(); // 获取当前文档的范围
  var text = editor.getDocument().toString(); // 获取当前文档的文本内容
  var keyword = at.getKeyword(text, range[0]); // 获取@关键字

  if (keyword) {
    var matches = at.match(keyword); // 匹配@关键字
    var suggestions = matches.map(function(match) {
      return { name: match };
    });

    at.showSuggestions(suggestions); // 显示匹配项
  } else {
    at.hideSuggestions(); // 隐藏匹配项
  }
});

// 监听At.js的select事件，在选择匹配项时插入@提及
at.on('select', function(item) {
  var mention = at.insert(item); // 插入@提及
  editor.insertHTML(mention); // 在Trix编辑器中插入@提及
});