Javascript 为什么计算属性返回未定义？

注意：在程序中使用的数据，这是造成我的麻烦来自外部，所以我很抱歉不能提供一个完整的工作示例。请让我知道如果有什么遗漏，我将添加所有我认为与理解上下文相关的信息

我的Vue实例有一个

computed

属性，它依赖于AJAX调用来引入数据。它所做的是将这些返回的数据（按原样）转换为Vue属性（

allcases

），以便在HTML代码中重用

从我的Vue实例计算的

部分：

computed: {
        allcases: function() {
            console.log('getting all cases')
            var request = $.ajax({
                    (...) <- a working AJAX call here, please see below
                })
                .done(function(msg) {
                    console.log('found: ' + JSON.stringify(msg.hits.hits));
                    return msg.hits.hits;
                })
                .fail(function(jqXHR, msg) {
                    console.log('error posting incident: ' + msg);
                });
        }
    }

因此，就在
返回msg.hits.hits
之前，
msg
（和
msg.hits.hits
）的内容是正确的，内容是我所期望的

这个例子是重复的

但是，当我运行脚本时，
所有案例
都是未定义的。

我知道这是因为

-1-

我正在观看Chrome中Vue扩展中的Vue组件

-2-

HTML文件包含以下代码

<div id="currentcases">
  {{allcases}}
</div>


{{allcases}}

当在开发工具的元素中观察到时，它是空的：

<div id="currentcases">

            </div> 



我真的不知道这段代码有什么问题。
根据，调用
$.ajax
返回，这就是您在
请求中保存的
变量，而不是
msg.hits.hits

为了实现您所要做的，考虑使用
< P>，调用“<代码> $.Ajax < /Calp>返回，这就是您在<代码>请求< /代码>变量中所保存的，而不是<代码> MSG.SHIV.SHIV< /COD> < /P>
为了实现你想要做的事情，考虑使用
 < p>你的代码>所有案例计算属性是“代码>未定义”，因为计算的属性的方法没有返回值。当您在
done
回调中返回一个值时，它不会神奇地在computed属性方法的范围内返回

除非您希望在每次某些依赖vue属性更改时触发异步调用，否则我不会将此代码设置为计算属性

我将使
allcases
成为一个常规数据属性，最初设置为
null
：

data() {
  return {
    allcases: null,
  }
}

然后，我将您的异步调用放入一个新方法（比如
fetchAllcases
）。在此方法中，您可以在
done
回调中直接将
allcases
数据属性设置为
msg.hits.hits
：

methods: {
  fetchAllcases() {
    let self = this;
    console.log('getting all cases')
    var request = $.ajax({
            (...) <- a working AJAX call here, please see below
        })
        .done(function(msg) {
            console.log('found: ' + JSON.stringify(msg.hits.hits));
            self.allcases = msg.hits.hits;
        })
        .fail(function(jqXHR, msg) {
            console.log('error posting incident: ' + msg);
        });
  }
}

您的
allcases
computed属性是
undefined
，因为该计算属性的方法没有返回值。当您在
done
回调中返回一个值时，它不会神奇地在computed属性方法的范围内返回

除非您希望在每次某些依赖vue属性更改时触发异步调用，否则我不会将此代码设置为计算属性

我将使
allcases
成为一个常规数据属性，最初设置为
null
：

data() {
  return {
    allcases: null,
  }
}

然后，我将您的异步调用放入一个新方法（比如
fetchAllcases
）。在此方法中，您可以在
done
回调中直接将
allcases
数据属性设置为
msg.hits.hits
：

methods: {
  fetchAllcases() {
    let self = this;
    console.log('getting all cases')
    var request = $.ajax({
            (...) <- a working AJAX call here, please see below
        })
        .done(function(msg) {
            console.log('found: ' + JSON.stringify(msg.hits.hits));
            self.allcases = msg.hits.hits;
        })
        .fail(function(jqXHR, msg) {
            console.log('error posting incident: ' + msg);
        });
  }
}

因为它不会回来了anything@thanksd当然是
计算的。所有情况下
仍将解析为函数本身？@thanksd:对不起，我不明白，请您详细说明一下好吗
msg.hits.hits
是一个数组，这就是returned@NickA不，计算属性不是这样工作的。他为computed属性定义的函数将运行，但如果它不返回任何内容，则访问vue实例的
allcases
属性将是
undefined
将在承诺的
done
回调中返回。它没有在计算属性的方法的范围内返回。因为它没有返回anything@thanksd当然是
计算的。所有情况下
仍将解析为函数本身？@thanksd:对不起，我不明白，请您详细说明一下好吗
msg.hits.hits
是一个数组，这就是returned@NickA不，计算属性不是这样工作的。他为computed属性定义的函数将运行，但如果它不返回任何内容，则访问vue实例的
allcases
属性将是
undefined
将在承诺的
done
回调中返回。它没有在计算属性的方法范围内返回。他甚至没有返回承诺。@RoyJ是的，但他正在
请求中保存它，所以我假设他正在使用它！但是他没有返回
请求
变量（这无论如何都没有意义）。这就是为什么computed属性的值是未定义的。
。他甚至没有返回承诺。@RoyJ是的，但他将其保存在
请求中
，所以我假设这就是他消费的东西！但是他没有返回
请求
变量（这无论如何都没有意义）。这就是为什么computed属性的值是未定义的。
“…常规数据属性最初设置为null”-使用初始null值设置目标存储属性解决了我的问题，谢谢！“…常规数据属性初始设置为null”-使用初始null值设置目标存储属性解决了我的问题，谢谢！