vditor 在 VUE 中 @用户 不支持异步获取数据

          {
            key: '@',
            hint: function(key) {
              let dataUser = [];
              this.$axios.get('url').then(res => {
                res.data.forEach((item) => {
                  dataUser.push({
                    value: `@${item.userName} `,
                    html: `<img src="${item.avatarUrl}"/> ${item.userName}`,
                  });
                });
              });
              return dataUser;
            },
          }

上述方式已确认无效!那么需要改造为同步方法

          {
            key: '@',
            hint: async function(key) {
              let dataUser = [];
              await this.$axios.get('url').then(res => {
                res.data.forEach((item) => {
                  dataUser.push({
                    value: `@${item.userName} `,
                    html: `<img src="${item.avatarUrl}"/> ${item.userName}`,
                  });
                });
              });
              return dataUser;
            },
          }

经过改造依然不行 ~~请问有什么方法能给解决这个问题么?

  • Vditor

    Vditor 是一款浏览器端的 Markdown 编辑器,支持所见即所得、即时渲染(类似 Typora)和分屏预览模式。它使用 TypeScript 实现,支持原生 JavaScript、Vue、React 和 Angular。

    185 引用 • 1112 回帖 • 1 关注
  • Q&A

    提问之前请先看《提问的智慧》,好的问题比好的答案更有价值。

    3334 引用 • 16874 回帖 • 485 关注

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • sutter

    我也想用异步, 解决了么, 是否底层就不支持呢

  • 其他回帖
  • zxc1204

    可以用原生的做这个

    this.mdOption.hint = {
            delay: 1000,
            extend: [
              {
                key: '@',
                hint: (key) => {
                  return this.getMemberList(key);
                },
              },
            ],
          };
    
    getMemberList(query) {
          const result = [];
          const xhr = new XMLHttpRequest();
          xhr.onreadystatechange = function() {
            if (xhr.readyState !== 4 || xhr.status !== 200) {
              return;
            }
            const data = JSON.parse(xhr.responseText);
            data.data.forEach((user) => {
              result.push({
                value: `@${user.name}\xa0`,
                html: `<img src="${user.avatar_url}"/> ${user.name}`,
              });
            });
          };
          xhr.open('get', `/api/member/users`, false);
          xhr.send(null);
          return result;
        },