xgqfrms™, xgqfrms® : xgqfrms's offical website of cnblogs! xgqfrms™, xgqfrms® : xgqfrms's offical website of GitHub!

Axios & Fetch API & Promise & POST All In One

Axios & Fetch API & Promise & POST All In One

Axios

$ npm i -S axios

https://github.com/axios/axios

Axios bug

    mounted() {
        console.log(`fetch data after mounted lifecycle!`);
        // let url = "http://localhost:8888/preview-user";
        // let url = "./preview-user.js";
        // let url = "./preview-user.json";
        let url = "http://10.1.5.202/es6-test/axios/preview-user.json";
        Axios.get(url)
        // .then(res => res.json())
        .then((res) => {
            let {
                data: json
            } =  res;
            console.log(`json =`, json);
            console.log(`json.data =`, json.data);
            // console.log(`res.data.data =`, res.data.data);
            // console.log(`res =`, res);
            // console.log(`res.message =`, res.message);
            // console.log(`res.data.length =`, res.data.length, JSON.stringify(res.data[0], null, 4));
        });
    },

Axios & Fetch

https://stackoverflow.com/questions/40844297/what-is-difference-between-axios-and-fetch

https://medium.com/@thejasonfile/fetch-vs-axios-js-for-making-http-requests-2b261cdd3af5

https://css-tricks.com/using-data-in-react-with-the-fetch-api-and-axios/

vue & mounted

https://stackoverflow.com/questions/32413905/initializing-vue-data-with-ajax/32443886#32443886

vue & created

https://stackoverflow.com/questions/47635503/fetch-data-with-vue-from-web-api

Ajax

Asynchronous JavaScript And XML

https://en.wikipedia.org/wiki/Ajax_(programming)

pagination

image


let table = new Uint8Array(100).map((item, i) => (item = i));

table.slice(0, 50);
table.slice(1*50, 1*50 + 50);


shit aliyun



fetch(url, {
    body: `nickname=xxxxx&_csrf_token=MD2ToUvQZ-3fk-g-gxczDhwiptfdRBnA57isO7wjBSE`,
    cache: "no-cache",
    credentials: "same-origin",
    // credentials: "include",
    headers: {
        "Content-Type": "application/x-www-form-urlencoded",
    },
    method: "POST",
    mode: "cors",
    redirect: "follow",
    referrer: "no-referrer",
})
.then(res => res.json())
.then(json => {
    // json
    console.log(`json =`, JSON.stringify(json, null, 4));
    return json;
})
.catch(err => console.error(`error =`, err));

image

demos

refs

https://appdividend.com/2018/02/20/vue-js-axios-tutorial/#Vue_js_Axios_Post_Example

http://codeheaven.io/how-to-use-axios-as-your-http-client/



©xgqfrms 2012-2021

www.cnblogs.com/xgqfrms 发布文章使用:只允许注册用户才可以访问!

原创文章,版权所有©️xgqfrms, 禁止转载 🈲️,侵权必究⚠️!


posted @   xgqfrms  阅读(410)  评论(5编辑  收藏  举报
编辑推荐:
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
阅读排行:
· DeepSeek 开源周回顾「GitHub 热点速览」
· 记一次.NET内存居高不下排查解决与启示
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布:重大改进与新特性概览!
· .NET10 - 预览版1新功能体验(一)
历史上的今天:
2015-11-13 https chrome
2015-11-13 SVG path d Attribute
2015-11-13 Two-factor Authentication (2FA)
2015-11-13 免费注册 美国虚拟手机号 接受短信 for github Two-factor authentication
点击右上角即可分享
微信分享提示