vue 的 computed 相关的一个问题，求助

[Hopetree]

但愿这个图能显示

情况如图所示，这个计算属性会在 sctext 变动时触发，实际上也的确会这样，但是我在 HTML 中使用{{ suggestion }}发现是空的，但是 console 日志会刷新值，所以很奇怪，为甚返回不到值？

如果图挂了，看源码：

<template>
    <div>
    	...	方便查看所以省略其他
        <p>{{ suggestion }}</p>
    </div>
</template>

<script>
export default {
    data() {
        return {
            // 从 store 里面读取数据并使用
            sctype: "",
            scdata: {},
            sctypelist: [],
            sctext: "",
        };
    },
    created() {
        // 设置默认值
        var default_type = this.$store.getters.searchTypes[0];
        this.sctype = default_type;
        this.sctypelist = this.$store.getters.searchTypes;
        this.scdata = this.$store.state.searchList[default_type];
    },
    computed: {
        suggestion: function() {
            var a = ''
            this.$axios
                .get("/baidu/su", { params: { wd: this.sctext } })
                .then(ret => {
                    var json_str = ret.data.match(/s:(\[.*\])}\);/);
                    if (json_str) {
                        var json_str = json_str[1];
                    }
                    console.log(json_str);
                    a = json_str
                });
            return a
        }
    },
    methods: {
        // 选择表单变化的时候同步数据
        changedata: function(command) {
            this.sctype = command;
            this.scdata = this.$store.state.searchList[command];
        }
    }
};
</script>

<style scoped>
img {
    width: 1.2rem;
    margin: 0rem 0.2rem -0.2rem 0rem;
}
</style>

[tumobi]

还是使用 async await 吧

[no1xsyzy]

基础概念问题…… 附一个 2014 年的演讲：
<amp-youtube data-videoid="8aGhZQkoFbQ" layout="responsive" width="480" height="270"></amp-youtube>

[SilentDepth]

@no1xsyzy #20 那个开关不是都被废弃了吗，没准哪天都不能用了（

[hyy1995]

你这个问题其实跟 vue 没啥关系，纯粹就是网络请求没请求完成前，你就 return 返回了，此时数据都还没取到，这就是个异步问题，太秀了吧。。。

[liuguang]

因为这个是异步的，请求还没完成，就 return 了

[galikeoy]

计算属性嵌套异步请求，龟龟，骚操作

[jrtzxh020]

有个 asyncComputed 的库 可以了解一下

[lscho]

亲亲，建议您学习一下 js 噢

[mikoshu]

只想说一句 666 好歹把 return 写到 promise 里面呀

[Curtion]

这是异步问题啊，和我初学 js 时犯的问题的一样，建议看看书巩固下基础

[mikoshu]

@mikoshu 就算 return 写到 promise 里 还得 return axios 然后返回一个 promise 估计也不好使 果然只能用 await 了 还有楼主改成 watch 的话 如果这个值变动很快 比如监听 input 的 input 事件 就得故意加延迟查询 不然请求太多

[Biwood]

1 楼和 7 楼都已经说到点子上了，去了解一下 JavaScript 同步和异步的原理和机制，比乱猜乱尝试有意义多了。后面还一堆扯到 async await 的，到底是有多菜啊各位，学习框架就真的不用学底层和基础知识了吗

[tolking]

建议你打开项目的 eslint 或者配置下。这种情况就会直接提示
```
Unexpected asynchronous action in "suggestion" computed property.eslint(vue/no-async-in-computed-properties)
```

[shintendo]

上面说用 await 可以解决的各位，麻烦上个代码好吗？

[shintendo]

@Biwood +1 我都惊了

[ljpCN]

楼主已经解决了，而且也很耐心地去寻求解决方案并尝试。不过还是想说，学 vue 之前，先学 js

[wunonglin]

这边建议 lz 先重新学习 vue 呢亲，async 也要另外学一下

[Sapp]

我好久没用过 computed 了，但是我似乎记得，这个属性推荐的是做同步操作啊？你这个需求应该在坚挺某个输入的值变化，然后再调用请求，请求完成之后设置 this.a

[mamahaha]

你这个相当于是暗恋一个人，对方却不知道。

[johnnyNg]

建议重学 js