vuejs如何從后端請求數(shù)據(jù)

這篇文章主要為大家展示了“vuejs如何從后端請求數(shù)據(jù)”，內(nèi)容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領(lǐng)大家一起研究并學(xué)習(xí)一下“vuejs如何從后端請求數(shù)據(jù)”這篇文章吧。

比如說從后端請求一張表過來，

（1）首先，在data中return一個(gè)msg:[]數(shù)組來接收表的數(shù)據(jù)；

（2）在方法中定義一個(gè)請求函數(shù)，比如我們這里函數(shù)名定義為showDetails；

methods:{

   showDetails:function(){
     this.$http.get(baseURL+“api/條件”).then(function(res){
      this.msg = res.body;
     });

}

}

這里baseURL項(xiàng)目的路徑，如果項(xiàng)目部署在服務(wù)器上面一般格式為www.XXX.com/項(xiàng)目名；之后的api是后端封裝的api接口；然后條件就是對表的查詢，刪除等語句。比如對名為student的表進(jìn)行查詢，需要獲取studentID為40001的學(xué)生信心，則查詢語句可寫為‘query?table=student&studentIDeq=40001',需要注意的是與有關(guān)數(shù)據(jù)庫的操作字段（通俗點(diǎn)講，可以理解為后端定義的字段）要加引號(hào)，而前端定義的字段要放在引號(hào)外面；

（3）最后，別忘了這個(gè)請求操作是沒有調(diào)用，是默認(rèn)執(zhí)行的，所以要在mounted里面實(shí)時(shí)執(zhí)行；

mounted: function (){
   this.showDetails();
  }

好了，這個(gè)函數(shù)就完成了，你可以通過瀏覽器控制臺(tái)的network查看從后端取得的數(shù)據(jù)，或者通過console打印輸出也可以看到啦?。?！

以上是“vuejs如何從后端請求數(shù)據(jù)”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注億速云行業(yè)資訊頻道！