vue-cli 中 使用vue-resource 輸出后台數據


 

閱讀此文前,請了解vue-cli 組件如何使用  http://www.cnblogs.com/pearl07/p/6252116.html

 

1,mock(模擬)后台數據(新建data.Json文件)。

 

2,在build文件夾下的dev-server.js中,導入數據。

 

3,在main.js文件中引用vue-resource。

----在此之前,需要使用  npm install vue-resource  安裝  vue-resource 依賴。

 

4,在app.vue中,在鈎子函數內,利用vue-resource發送異步請求,成功后執行。

----在template中使用的<headcomp></headcomp>組件中,綁定(v-bind)獲取的數據。

----v-bind:home=“home”  可以簡寫為 --- :home=“home”。

 

5,headcomp組件,在export default中,使用props接收綁定傳過來的數據。

----於是便可以{{home.title}}進行調用,並渲染出。

 

6,最終效果


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM