TinyMCE .filter() 不是提到的功能（Laravel）答案

【问题标题】：TinyMCE .filter() is not a function on mention (Laravel)TinyMCE .filter() 不是提到的功能（Laravel）
【发布时间】：2021-05-16 18:57:15
【问题描述】：

很长一段时间以来，我一直在尝试解决我的问题，但是无论我做什么，我都无法解决这个问题。目前，根据 TinyMCE 的文档，此代码由他们提供。

  /* This represents a database of users on the server */
  var userDb = {};
  userNames.map(function(fullName) {
      var name = fullName.toLowerCase().replace(/ /g, '');
      var description = descriptions[Math.floor(descriptions.length * Math.random())];
      var image = 'https://s3.amazonaws.com/uifaces/faces/twitter/' + images[Math.floor(images.length * Math.random())] + '/128.jpg';
      return {
          id: name,
          name: name,
          fullName: fullName,
          description: description,
          image: image
      };
  }).forEach(function(user) {
      userDb[user.id] = user;
  });

  /* This represents getting the complete list of users from the server with only basic details */
  var fetchUsers = function() {
      return new Promise(function(resolve, _reject) {
          /* simulate a server delay */
          setTimeout(function() {
              var users = Object.keys(userDb).map(function(id) {
                  return {
                      id: id,
                      name: userDb[id].name,
                  };
              });
              resolve(users);
          }, 500);
      });
  };

  /* This represents requesting all the details of a single user from the server database */
  var fetchUser = function(id) {
      return new Promise(function(resolve, reject) {
          /* simulate a server delay */
          setTimeout(function() {
              if (Object.prototype.hasOwnProperty.call(userDb, id)) {
                  resolve(userDb[id]);
              }
              reject('unknown user id "' + id + '"');
          }, 300);
      });
  };

  return {
      fetchUsers: fetchUsers,
      fetchUser: fetchUser
  };
  })();

  /* These are "local" caches of the data returned from the fake server */
  var usersRequest = null;
  var userRequest = {};

  var mentions_fetch = function(query, success) {
      /* Fetch your full user list from somewhere */
      if (usersRequest === null) {
          usersRequest = fakeServer.fetchUsers();
      }
      usersRequest.then(function(users) {
          /* query.term is the text the user typed after the '@' */
          users = users.filter(function(user) {
              return user.name.indexOf(query.term.toLowerCase()) !== -1;
          });

          users = users.slice(0, 10);

          /* Where the user object must contain the properties `id` and `name`
             but you could additionally include anything else you deem useful. */
          success(users);
      });
  };

但是，当我尝试更改假服务器以通过 API 路由从我的实际服务器获取数据时，我得到 .filter is not a function 错误。所以我想我会使用 Object. values() 方法，但它不返回任何内容，并且控制台日志显示为空。

这是我在控制器中的逻辑（我正在使用 Laravel 顺便说一句）

    public function getUsers(Request $request) {
    $user = User::all();
    return $user;
}

当我更改此行时会出现过滤器问题：

      if (usersRequest === null) {
      usersRequest = fakeServer.fetchUsers();
  }

像这样对我的 API 调用：

     if (usersRequest === null) {
      usersRequest = fetch('api/users/mention');
  }

我的 API 响应如下：

    [{id: 1, name: "John", email: "john@doe.com", email_verified_at: null,…},…]
0: {id: 1, name: "John", email: "john@doe.com", email_verified_at: null,…}
1: {id: 2, name: "Admin", email: "vi@example.com", email_verified_at: "2021-02-07 12:01:18",…}
2: {id: 3, name: "Admin2", email: "di@example", email_verified_at: "2021-02-07 12:01:46",…}

【问题讨论】：

usersRequest = fetch('api/users/mention');我没有看到您的 fetch 函数，但它可能是异步的，即它不会立即返回用户数据，需要回调函数来检索数据。
嗨 Anurat，你写的是 fetch 函数，api 响应来自控制台日志:) 但是，由于某种原因，过滤器函数不起作用，我假设它与api 响应是对象
好的，请使用console.log或其他东西显示您的api响应。
我已将我的检查元素中的图像添加到问题中，希望对您有所帮助
好的，但是 userRequest 的值是多少？尝试 console.log(userRequest) 如果它为空，那么数据不会返回 fetch()

标签： javascript ajax laravel tinymce tinymce-5

【解决方案1】：

想通了！经过一番苦苦尝试，终于找到了解决办法。

将 tinymce 脚本包装在一个函数中，我将我的脚本包装在一个名为 function tinyMCE() 的函数中

在函数之前，运行一个 ajax api 调用

var usergetNames = [];
    $.ajax({
           url: '/api/users/mention',
            method: 'get',
             dataType: 'json',
             contentType: 'application/json',
            success: function (data) {
              usergetNames = data;
             tinyMCE();
             },
           error: function (ex) {
           alert(ex.responseText);
         }
    });

在 tinyMCE 中，用这个替换 var userNames 行

var userNames = usergetNames;

您可以在他们的官方文档页面中获取涉及 tinymce 的其余代码。

【讨论】：