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

(🐞 反爬虫测试!打击盗版⚠️)如果你看到这个信息, 说明这是一篇剽窃的文章,请访问 https://www.cnblogs.com/xgqfrms/ 查看原创文章!

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 @ 2018-11-13 14:09  xgqfrms  阅读(409)  评论(5编辑  收藏  举报