{"id":99974,"date":"2020-04-26T17:13:15","date_gmt":"2020-04-26T09:13:15","guid":{"rendered":"http:\/\/4563.org\/?p=99974"},"modified":"2020-04-26T17:13:15","modified_gmt":"2020-04-26T09:13:15","slug":"%e8%af%b7%e6%95%99%e5%85%b3%e4%ba%8e-js-%e7%9a%84-await-%e7%9a%84%e9%97%ae%e9%a2%98%ef%bc%8c%e5%ba%94%e8%af%a5%e6%b2%a1%e9%82%a3%e4%b9%88%e5%b9%bc%e7%a8%9a","status":"publish","type":"post","link":"http:\/\/4563.org\/?p=99974","title":{"rendered":"\u8bf7\u6559\u5173\u4e8e JS \u7684 await \u7684\u95ee\u9898\uff0c\u5e94\u8be5\u6ca1\u90a3\u4e48\u5e7c\u7a1a"},"content":{"rendered":"
\n
\n
\n

\u8bf7\u6559\u5173\u4e8e JS \u7684 await \u7684\u95ee\u9898\uff0c\u5e94\u8be5\u6ca1\u90a3\u4e48\u5e7c\u7a1a <\/h1>\n

<\/p>\n

\n
\u8cc7\u6df1\u5927\u4f6c : Rexxar <\/span> <\/i> 55<\/span> <\/div>\n
<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n
<\/p>\n

\u516c\u53f8\u5c31\u6211\u4e00\u4e2a\u5f00\u53d1\uff0c\u540e\u7aef\u88ab\u903c\u6210\u4e86\u5168\u5e72\uff0c\u73b0\u5728\u524d\u7aef\u8d8a\u6765\u8d8a\u590d\u6742\uff0c\u5934\u5927\u3002<\/p>\n

\u627e\u4e86\u4e2a VUE \u7684\u6a21\u677f\u3002echarts \u60f3\u7528 ydata \u63a5\u6536\u540e\u7aef\u4f20\u6765\u7684\u503c\uff0c\u5b9a\u4e49\u4e86\u53d6\u503c\u7684\u65b9\u6cd5 fetchData\uff0c\u56e0\u4e3a\u662f axios \u5f02\u6b65\u7684\uff0c\u5728 drawLine \u8c03\u7528 await \u4fee\u9970\u7684 fetchData\uff0c\u7136\u800c console.log ydata \u662f\u7a7a\u7684\uff0c\u611f\u89c9\u662f\u4e00\u4e2a await \u4e0d\u7ba1\u7528\uff0c\u8fd8\u6709 then \u7684\u5f71\u54cd\u6ca1\u6d88\u9664\u3002 \u4f46\u662f\u6211\u4e0d\u8c03\u7528 fetchData()\uff0c\u76f4\u63a5\u5728 drawLine()\u91cc\u9762\u4f7f\u7528 await this.$axiso.post(…),\u5374\u6210\u529f\u7ed9 ydata \u8d4b\u503c\u4e86\u3002\u770b\u8d77\u6765\u8ddf\u76f4\u63a5\u8c03\u7528 fetchData \u6ca1\u4ec0\u4e48\u533a\u522b\uff0c\u7406\u89e3\u4e0d\u4e86\u3002<\/p>\n

methods: { fetchData() { this.$axios .post(“\/controllermsgdatelist”, this.listQuery) .then(response => { this.ydata = response.data.result; }); },<\/p>\n

async drawLine() {   await this.$axios     .post(\"\/controllermsgdatelist\", this.listQuery)     .then(response => {       this.ydata = response.data.result;     });    \/\/ await this.fetchData();    console.log(this.ydata); <\/code><\/pre>\n
}<\/p>\n<\/p><\/div>\n
<\/p>\n
 \u5927\u4f6c\u6709\u8a71\u8aaa<\/b> (22<\/span>)        <\/div>\n
 <\/div>\n<\/p><\/div>\n<\/p><\/div>\n
    \n
  • \n
    \n
    \n
     \u8cc7\u6df1\u5927\u4f6c : runhua <\/span>  <\/div>\n
     <\/i>            <\/span> <\/div>\n<\/p><\/div>\n
                                                                 \u597d\u4e45\u6ca1\u5199 js\uff0c\u597d\u50cf\u662f
    let res = await this.$axios
     .post(“\/controllermsgdatelist”, this.listQuery)<\/p>\n
     console.log(res);
    }
    \u7ed3\u679c\u4ece res \u91cc\u9762\u53d6                                                            <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
     \u8cc7\u6df1\u5927\u4f6c : Sapp <\/span>  <\/div>\n
     <\/i>            <\/span> <\/div>\n<\/p><\/div>\n
                                                                 \u4f60\u7684 fetchData \u65b9\u6cd5\u6ca1\u6709\u628a\u5f02\u6b65 return \u51fa\u6765<\/p>\n
    fetchData() {
     return this.$axios.get(‘\/xxx’)
    }<\/p>\n
    async drawLine() {
     const res = await this.fetchData()
     console.log(res)
    }<\/p>\n
    \u8fd9\u6837\u5e94\u8be5\u662f\u6ca1\u95ee\u9898\u7684                                                            <\/p><\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
     \u8cc7\u6df1\u5927\u4f6c : scyangjian <\/span>  <\/div>\n
     <\/i>            <\/span> <\/div>\n<\/p><\/div>\n
                                                                 B \u7ad9\u641c\u5168\u6808\u4e4b\u5dc5\u53ef\u4ee5\u770b\u770b\u4ed6\u7684\u662f\u600e\u4e48\u5199\u7684                                                            <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
     \u8cc7\u6df1\u5927\u4f6c : fishlium <\/span>  <\/div>\n
     <\/i>            <\/span> <\/div>\n<\/p><\/div>\n
                                                                 fetchData \u6539\u6210
    ““
    async fetchData() { 
     const res = await this.$axios.post(“\/controllermsgdatelist”, this.listQuery);
     this.ydata = res.data.result;
    }
    ““                                                            <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
     \u8cc7\u6df1\u5927\u4f6c : wangyzj <\/span>  <\/div>\n
     <\/i>            <\/span> <\/div>\n<\/p><\/div>\n
                                                                 \u522b\u95ee\u4e3a\u4ec0\u4e48
    \u5e72\u5c31\u662f\u4e86                                                            <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
     \u8cc7\u6df1\u5927\u4f6c : zhw2590582 <\/span>  <\/div>\n
     <\/i>            <\/span> <\/div>\n<\/p><\/div>\n
                                                                 \u770b\u770b this.ydata \u7684\u8d4b\u503c\u8fc7\u7a0b\u662f\u4e0d\u662f\u5f02\u6b65\u7684\uff0c\u5f02\u6b65\u7684\u8bdd\u53ef\u80fd\u5f15\u8d77\u7a7a\u503c                                                            <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
     \u8cc7\u6df1\u5927\u4f6c : zhw2590582 <\/span>  <\/div>\n
     <\/i>            <\/span> <\/div>\n<\/p><\/div>\n
                                                                 async drawLine() {
     this.ydata = await this.$axios
     .post(“\/controllermsgdatelist”, this.listQuery)
     .then(response => response.data.result);<\/p>\n
     console.log(this.ydata);
    }                                                            <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
     \u8cc7\u6df1\u5927\u4f6c : Hypn0s <\/span>  <\/div>\n
     <\/i>            <\/span> <\/div>\n<\/p><\/div>\n
                                                                 \u4e8c\u6b63\u89e3<\/p>\n
    “`javascript<\/p>\n
    fetchData() {
     return this.$axios
     .post(“\/controllermsgdatelist”, this.listQuery)
     .then(response => {
     this.ydata = response.data.result;
     });
    }<\/p>\n
    “`                                                            <\/p><\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
     \u8cc7\u6df1\u5927\u4f6c : shintendo <\/span>  <\/div>\n
     <\/i>            <\/span> <\/div>\n<\/p><\/div>\n
                                                                 2L \u8bf4\u7684\u5bf9\uff0c\u4f60\u5c31\u662f\u6ca1\u628a promise return \u51fa\u6765                                                            <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
     \u8cc7\u6df1\u5927\u4f6c : wu67 <\/span>  <\/div>\n
     <\/i>            <\/span> <\/div>\n<\/p><\/div>\n
                                                                 \u5176\u5b9e\u5c31\u662f\u6ca1 return…\u800c\u4e14\u4e0d\u7528 async \u90fd\u884c\u5427, \u76f4\u63a5 promise then \u66f4\u52a0\u65e0\u8111, \u770b\u8d77\u6765\u66f4\u50cf\u662f\u540c\u6b65                                                            <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
     \u8cc7\u6df1\u5927\u4f6c : shintendo <\/span>  <\/div>\n
     <\/i>            <\/span> <\/div>\n<\/p><\/div>\n
                                                                 \u5176\u5b9e\u5f88\u7b80\u5355\uff0c\u4f60\u628a this.$axios.post(…).then(…)\u8fd9\u4e2a\u8868\u8fbe\u5f0f\u8bb0\u4e3a\u53d8\u91cf x\uff0c\u518d\u5bf9\u6bd4\u4e00\u4e0b\u4f60\u7684\u4e24\u4e2a\u5199\u6cd5\uff1a
    \u2460
    fetchData() {x}
    await fetchData()
    \u2461
    await x<\/p>\n
    \u5c31\u80fd\u4e00\u773c\u770b\u51fa\u5dee\u5f02\u4e86                                                            <\/p><\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
     \u8cc7\u6df1\u5927\u4f6c : mikoshu <\/span>  <\/div>\n
     <\/i>            <\/span> <\/div>\n<\/p><\/div>\n
                                                                 await \u9700\u8981 return \u4e00\u4e2a promise                                                            <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
     \u8cc7\u6df1\u5927\u4f6c : ashong <\/span>  <\/div>\n
     <\/i>            <\/span> <\/div>\n<\/p><\/div>\n
                                                                 \u5916\u9762\u518d\u5957\u4e00\u4e2a promise                                                            <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
     \u8cc7\u6df1\u5927\u4f6c : hyzzz <\/span>  <\/div>\n
     <\/i>            <\/span> <\/div>\n<\/p><\/div>\n
                                                                 2 \u8bf4\u7684\u5bf9\uff0cawait \u540e\u9762\u8ddf\u7740 promise                                                            <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
     \u8cc7\u6df1\u5927\u4f6c : star7th <\/span>  <\/div>\n
     <\/i>            <\/span> <\/div>\n<\/p><\/div>\n
                                                                 \u8fd9\u4e2a\u597d\u50cf\u662f axios \u6e90\u7801\u8bbe\u8ba1\u5982\u6b64\u3002\u540e\u9762\u6709 then \u548c\u6ca1\u6709 then \u8fd4\u56de\u7684\u4e1c\u897f\u4e0d\u4e00\u6837\u3002\u5b83\u662f\u4e3a\u4e86\u517c\u5bb9 await \u7684\u5199\u6cd5\u548c\u65e9\u524d\u6d41\u884c\u7684 then \u5199\u6cd5\u3002\u4f60\u9009\u62e9\u5176\u4e2d\u4e00\u4e2a\u65b9\u5f0f\u53bb\u505a\u5c31\u597d\u3002\u4e0d\u8981\u4e24\u4e2a\u4e00\u8d77\u6765                                                            <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
     \u8cc7\u6df1\u5927\u4f6c : star7th <\/span>  <\/div>\n
     <\/i>            <\/span> <\/div>\n<\/p><\/div>\n
                                                                 \u597d\u50cf\u6211\u6ca1\u8bb2\u5bf9\u3002\u603b\u662f\u8fd9\u4e24\u79cd\u65b9\u5f0f\u53ea\u9009\u62e9\u4e00\u79cd\u6765\u7528\u5c31\u662f\u4e86\u3002                                                            <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
     \u8cc7\u6df1\u5927\u4f6c : shintendo <\/span>  <\/div>\n
     <\/i>            <\/span> <\/div>\n<\/p><\/div>\n
                                                                 @star7th async\/await \u548c Promise \u4e00\u8d77\u7528\u6ca1\u6709\u4efb\u4f55\u95ee\u9898\uff0c\u6709\u4e9b\u573a\u666f\u53ea\u7528 async\/await \u5b9e\u73b0\u4e0d\u4e86\uff0c\u5fc5\u987b\u6df7\u7528 Promise.<\/p>\n
    \u628a await \u7406\u89e3\u4e3a\u201c\u672c\u53e5\u4ee5\u4e0b\u76f4\u5230\u51fd\u6570\u672b\u5c3e\u7684\u5185\u5bb9\u5168\u90e8\u653e\u5165\u4e00\u4e2a\u9690\u85cf\u7684 then\u201d\u5c31\u4e0d\u4f1a\u6655\u8f66\u4e86                                                            <\/p><\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
     \u4e3b<\/span> \u8cc7\u6df1\u5927\u4f6c : Rexxar <\/span>  <\/div>\n
     <\/i>            <\/span> <\/div>\n<\/p><\/div>\n
                                                                 @Sapp 
    @shintendo <\/p>\n
    \u52a0\u4e86 return \u786e\u5b9e\u5bf9\u4e86
    \u4f46\u662f ydata \u7684\u8d4b\u503c\u64cd\u4f5c\u653e\u5728\u4e86 fetchData \u91cc\u3002\u5373\u65f6\u4e0d return\uff0c\u8fd9\u6761\u6307\u4ee4\u8be5\u6267\u884c\u4e5f\u8981\u6267\u884c\u554a\u3002 \u6bd4\u5982\u6211\u6709\u4e2a table\uff0c\u8d4b\u503c\u4e5f\u653e\u5728\u4e86 fetchData \u91cc\uff0cthis.tablelist = response.data.result\u3002 \u9875\u9762\u7684 table \u786e\u5b9e\u663e\u793a\u6570\u636e\uff0c\u6240\u4ee5\u8fd9\u4e2a return \u4e0d\u662f\u8ba9\u672c\u6765\u4e0d\u4f1a\u8fd4\u56de\u7684\u503c\u8fd4\u56de\uff0c\u800c\u662f\u8ba9\u6267\u884c\u987a\u5e8f\u63d0\u524d\u4e86\uff1f                                                            <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
     \u8cc7\u6df1\u5927\u4f6c : azcvcza <\/span>  <\/div>\n
     <\/i>            <\/span> <\/div>\n<\/p><\/div>\n
                                                                 async \u548c await \u5176\u5b9e\u662f promise \u7684\u8bed\u6cd5\u7cd6\u6765\u7740                                                            <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
     \u8cc7\u6df1\u5927\u4f6c : shintendo <\/span>  <\/div>\n
     <\/i>            <\/span> <\/div>\n<\/p><\/div>\n
                                                                 @Rexxar \u4f60\u53ef\u80fd\u60f3\u7684\u592a\u590d\u6742\u4e86
    > \u5373\u65f6\u4e0d return\uff0c\u8fd9\u6761\u6307\u4ee4\u8be5\u6267\u884c\u4e5f\u8981\u6267\u884c\u554a
    \u662f\u7684\uff0c\u8fd9\u6761\u6307\u4ee4\u6267\u884c\u4e86\uff0c\u95ee\u9898\u5728\u4e8e await \u6ca1\u6709\u6b63\u786e\u5730\u7b49\u5f85\u8fd9\u6761\u6307\u4ee4\u6267\u884c\u5b8c\uff0c\u5373 await \u7b49\u5f85\u7684\u76ee\u6807\u4e0d\u5bf9\u3002
    await fetchData()\u8fd9\u6761\u8bed\u53e5\uff0cawait \u7684\u5bf9\u8c61\u662f fetchData()\uff0c\u5373 fetchData \u51fd\u6570\u8c03\u7528\u7684\u8fd4\u56de\u503c\uff0c\u800c\u4f60\u6ca1\u6709\u8fd4\u56de\u4efb\u4f55\u4e1c\u897f\uff0c\u76f8\u5f53\u4e8e await undefined;                                                            <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
     \u8cc7\u6df1\u5927\u4f6c : Vogan <\/span>  <\/div>\n
     <\/i>            <\/span> <\/div>\n<\/p><\/div>\n
                                                                 \u65e2\u7136\u7528 async\/await \u4e86\uff0c\u5c31\u90fd\u7528\uff0c\u522b\u4e00\u4f1a\u53c8 Promise \u7684\u3002\u80e1\u4e71\u6251\u817e\u3002                                                            <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
     \u8cc7\u6df1\u5927\u4f6c : Reol <\/span>  <\/div>\n
     <\/i>            <\/span> <\/div>\n<\/p><\/div>\n
                                                                 @shintendo \u611f\u8c22\u5927\u4f6c\uff0c\u5403\u74dc\u8fc7\u7a0b\u53d1\u73b0\u539f\u6765\u81ea\u5df1\u7406\u89e3\u7684\u4e5f\u4e0d\u6df1\u523b\u3002                                                            <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n","protected":false},"excerpt":{"rendered":"
    \u8bf7\u6559\u5173\u4e8e JS \u7684 await \u7684…<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[],"tags":[],"_links":{"self":[{"href":"http:\/\/4563.org\/index.php?rest_route=\/wp\/v2\/posts\/99974"}],"collection":[{"href":"http:\/\/4563.org\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/4563.org\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/4563.org\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/4563.org\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=99974"}],"version-history":[{"count":0,"href":"http:\/\/4563.org\/index.php?rest_route=\/wp\/v2\/posts\/99974\/revisions"}],"wp:attachment":[{"href":"http:\/\/4563.org\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=99974"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/4563.org\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=99974"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/4563.org\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=99974"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}