{"id":526,"date":"2020-02-26T21:18:25","date_gmt":"2020-02-26T13:18:25","guid":{"rendered":"https:\/\/blog.cqdefxxx.com\/?p=526"},"modified":"2020-02-26T21:18:25","modified_gmt":"2020-02-26T13:18:25","slug":"vue-axiosfetch","status":"publish","type":"post","link":"https:\/\/blog.viter.top\/index.php\/2020\/02\/26\/vue-axiosfetch\/","title":{"rendered":"Vue-axios&fetch"},"content":{"rendered":"

fetch<\/strong><\/h1>\n
<!DOCTYPE html>\n<html>\n<head>\n<meta charset=\"utf-8\">\n<meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge,chrome=1\">\n<title>fetch<\/title>\n<meta name=\"description\" content=\"\">\n<meta name=\"keywords\" content=\"\">\n<link href=\"\" rel=\"stylesheet\">\n<script type=\"text\/javascript\" src=\"lib\/vue.js\"><\/script>\n<\/head>\n<body>\n    <div id=\"box\">\n    \t<button @click=\"handleClick()\">\u6b63\u5728\u70ed\u6620<\/button>\n\n        <ul>\n            <li v-for=\"data in datalist\">\n                <img :src=\"data.poster\"\/>\n                <h3>{{data.name}}<\/h3>\n                <p>{{data.synopsis}}<\/p>\n\n                <ul>\n                    <li v-for=\"item in data.actors\">\n                        <img :src=\"item.avatarAddress\"\/>\n                        <h4>{{item.name}}<\/h4>\n                    <\/li>\n                <\/ul>\n            <\/li>\n        <\/ul>\n    <\/div>\n    <script type=\"text\/javascript\">\n    \t\n       new Vue({\n        el:\"#box\",\n        data:{\n            datalist:[]\n        },\n        methods:{\n            handleClick(){\n                fetch(\"json\/test.json\").then(result=>result.json()).then(res=>{\n                    console.log(res);\n                    this.datalist =res.data.films\n                })\n                \/\/post-1\n\n               \/\/ fetch(\"json\/test.json\",{\n               \/\/  method:\"post\",\n               \/\/  headers:{\n               \/\/      \"Content\u2010Type\":\u00a0\"application\/x\u2010www\u2010form\u2010urlencoded\" \n               \/\/  },\n               \/\/  credentials:\u00a0 'include',\n               \/\/  body:\"name=kerwin&age=100\"\n               \/\/ }).then(res=>res.json()).then(res=>{\n               \/\/  console.log(res);\n               \/\/ })\n\n               \/\/post -2 \n                \n                \/\/ fetch(\"json\/test.json\",{\n                \/\/  method:\"post\",\n                \/\/  headers:{\n                \/\/      \"Content\u2010Type\":\u00a0\"application\/json\" \n                \/\/  },\n                \/\/  body:JSON.stringify({\n                \/\/     name:\"kerwin\",\n                \/\/     age:100\n                \/\/  })\n                \/\/ }).then(res=>res.json()).then(res=>{\n                \/\/  console.log(res);\n                \/\/ })\n            }\n        }\n       })\n\n    <\/script>\n<\/body>\n<\/html><\/code><\/pre>\n
axios<\/h1>\n
<!DOCTYPE html>\n<html>\n<head>\n<meta charset=\"utf-8\">\n<meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge,chrome=1\">\n<title>fetch<\/title>\n<meta name=\"description\" content=\"\">\n<meta name=\"keywords\" content=\"\">\n<link href=\"\" rel=\"stylesheet\">\n<script type=\"text\/javascript\" src=\"lib\/vue.js\"><\/script>\n<script src=\"https:\/\/unpkg.com\/axios\/dist\/axios.min.js\"><\/script>\n\n<\/head>\n<body>\n    <div id=\"box\">\n        <button @click=\"handleClick()\">\u6b63\u5728\u70ed\u6620<\/button>\n\n        <ul>\n            <li v-for=\"data in datalist\">\n                <img :src=\"data.poster\"\/>\n                <h3>{{data.name}}<\/h3>\n                <p>{{data.synopsis}}<\/p>\n\n                <ul>\n                    <li v-for=\"item in data.actors\">\n                        <img :src=\"item.avatarAddress\"\/>\n                        <h4>{{item.name}}<\/h4>\n                    <\/li>\n                <\/ul>\n            <\/li>\n        <\/ul>\n    <\/div>\n    <script type=\"text\/javascript\">\n        \n       new Vue({\n        el:\"#box\",\n        data:{\n            datalist:[]\n        },\n        methods:{\n            handleClick(){\n              \/\/ axios.get(\"json\/test.json\").then(res=>{\n              \/\/   console.log(res.data);\/\/\u771f\u6b63\u7684\u540e\u7aef\u6570\u636e\u85cf\u5728res.data\n              \/\/   this.datalist= res.data.data.films\n              \/\/ })\n            \n              axios({\n                url:\"https:\/\/m.maizuo.com\/gateway?cityId=110100&pageNum=1&pageSize=10&type=1&k=1384809\",\n                headers:{\n                  'X-Client-Info': '{\"a\":\"3000\",\"ch\":\"1002\",\"v\":\"5.0.4\",\"e\":\"154277371928424093566579\"}',\n                  'X-Host': 'mall.film-ticket.film.list'\n                }\n              }).then(res=>{\n                console.log(res.data);\n                this.datalist= res.data.data.films\n              })\n\n            } \n        }\n       })\n       \/\/vue-resource 2.0 \u4f5c\u8005\u4e0d\u518d\u7ef4\u62a4\uff0c\u6781\u529b\u63a8\u8350 axios\n    <\/script>\n<\/body>\n<\/html><\/code><\/pre>\n
 <\/p>\n","protected":false},"excerpt":{"rendered":"
fetch <!DOCTYPE html> <html> <head> <meta ch …<\/p>","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[],"tags":[9,10],"_links":{"self":[{"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/posts\/526"}],"collection":[{"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/comments?post=526"}],"version-history":[{"count":0,"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/posts\/526\/revisions"}],"wp:attachment":[{"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/media?parent=526"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/categories?post=526"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.viter.top\/index.php\/wp-json\/wp\/v2\/tags?post=526"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}