axios获取数据

安装axios

cnpm i axios -S

引入

import axios from 'axios';

asyncData方法会在组件(限于page页面组件)每次加载之前被调用。它可以在服务端或路由更新之前被调用。
因为 asyncData 在前端渲染页面之前调用,所以 asyncData 中没有 this。
先通过 asyncData 中的代码获取到远程的数据,然后再把得到的远程数据合并到当前前端组件 data 中,然后在渲染页面,这就是 ssr 渲染的过程。

export default {
    async asyncData({ params }) {
        let { data } = await axios.get('/1.json');
        console.log('data:', data);
        return data;    // 这个return会把结果和data属性的值自动合并,视图层直接调用即可。
    }
};

如果不喜欢 es6 的 async/await,那么也可以使用回调函数。

asyncData({ params }, callback){
    axios.get(`http://127.0.0.1:3000/goods`).then(res=>{
        callback(null, {
            a:1,
            arr:res.data
        })
    })    
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容