当前位置：文江博客话题详情

NUXT 2.14：等到内部的所有内容都将完成

发布于 2025-02-13 08:22:59 字数 959 浏览 0 评论 0原文

我有一个问题。在Nuxt的fetch挂钩中，我有一些异步调用，这些调用由 nuxt content api。

然后在安装挂钩中使用了一些这些数据。

但是，当nuxt在fetch内处理第一个请求时，控制流程传递到已安装挂钩，因此没有必要的数据。

是的，我尝试使用之类的东西，如果（！返回;，但显然已安装仅调用一次。有人知道我该如何迫使nuxt等待吗？顺便说一句，该应用程序正在使用静态站点生成，并且该组件具有属性fetchonserver设置为false。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

撕心裂肺的伤痛 2025-02-20 08:22:59

将其留在此处以供将来参考（我自己）：在您的fetch函数中，您可以将实例变量设置为一旦远程调用完成后将解决的承诺，然后等待已安装。

        export default {
            name: 'Search',
            data () {
                    const core = useCore();             
                    var data = {
                            source: null,
                            fetching: false,
                    };
                    return data;
            },
            fetch: async function(){
var self = this;
                    this.fetching = new Promise(async function(resolve, reject){
                            try{
                                    var req = await self.$axios.get("https://example.com/source.json");
                                    self.source = req.data;
                                    resolve();
                            }catch(err){
                                    console.log("Exception loading remote source: ", err);
                            }
                    });
        },
        fetchOnServer: false,       
            mounted: async function()
            {
                    if(this.fetching) await this.fetching;
            }
    }

Leaving this here for future reference (by myself): in your fetch function you can set an instance variable to a promise that will be resolved once the remote call is complete, and then await that variable in mounted.

        export default {
            name: 'Search',
            data () {
                    const core = useCore();             
                    var data = {
                            source: null,
                            fetching: false,
                    };
                    return data;
            },
            fetch: async function(){
var self = this;
                    this.fetching = new Promise(async function(resolve, reject){
                            try{
                                    var req = await self.$axios.get("https://example.com/source.json");
                                    self.source = req.data;
                                    resolve();
                            }catch(err){
                                    console.log("Exception loading remote source: ", err);
                            }
                    });
        },
        fetchOnServer: false,       
            mounted: async function()
            {
                    if(this.fetching) await this.fetching;
            }
    }

回复收藏 0 原文

~没有更多了~