Question

我在我的淘汰视图中使用getJSON：

$.getJSON("/GetItems", function (data) {
    self.Items(data.map(viewModelFromData));
});

我想让它成为重用的函数，所以下次我可以在页面操作上重新加载项目。怎么做？

当我尝试时：

self.getBasketItems = $.getJSON("/umbraco/Surface/Booking/GetBasketItems",
        function(data) {
            self.Items(data.map(viewModelFromData));
            // or return data.map(viewModelFromData);
        });

我的self.getBasketItems()是undefined。

Answer 1

最快的解决方法：

self.getBasketItems = function() {
  return $.getJSON(
    "/umbraco/Surface/Booking/GetBasketItems",
    function(data) {
        self.Items(data.map(viewModelFromData));
    });
 };

这会返回承诺，因此您可以在链中使用它：

self.getBasketItems().then(function() { console.log(self.Items()); })

您还可以制作更通用的实用功能，例如：

const getTransformWrite = (url, converter, target) =>
  () =>
    $.getJSON(url)
      .then(converter)
      .then(target);
  }
}

self.getBasketItems = getTransformWrite(
  "/umbraco/Surface/Booking/GetBasketItems",
  data => data.map(viewModelFromData),
  self.Items
);

我并不认为这是一种改进，但它可能适合你的风格。

确保您不会忘记处理异常/错误！

Answer 2

@ haim770建议的是：

self.getBasketItems = function() {
  return $.getJSON(
    "/umbraco/Surface/Booking/GetBasketItems",
    function(data) {
        self.Items(data.map(viewModelFromData));
    });
 };

但是，从您的评论中，您似乎正在尝试将值实际返回到self.getBasketItems中？在这种情况下，您需要使用$ .ajax方法进行同步调用（getJSON是异步的）。

self.getBasketItems = function() {
  var _r;
  $.ajax(
    dataType: "json",
    async: false,
    url: "/umbraco/Surface/Booking/GetBasketItems",
    success: function(data) {
        _r = self.Items(data.map(viewModelFromData));
    });

  return _r
 };

请注意，第二种解决方案非常古怪。并且浏览器实际上将等待来自服务器的响应。你最好使用回调或承诺。

请告诉我这是否有帮助！

干杯，

淘汰赛：如何将$ .get放入函数中？

2 个答案: