使用axios读取一下数据

    1. // data/carts.json
    2. [
    3.     {
    4.         "isSelected": true,
    5.         "productCover": "https://img3.doubanio.com/view/subject/m/public/s33510542.jpg",
    6.         "productName": "纸上行舟",
    7.         "productInfo": "青年作者黎幺短篇小说首度结集",
    8.         "productPrice": 57.33,
    9.         "productCount": 3,
    10.         "id": "0001"
    11.     },
    12.     {
    13.         "isSelected": true,
    14.         "productCover": "https://img3.doubanio.com/view/subject/m/public/s33497735.jpg",
    15.         "productName": "我可能得抑郁症了！舟",
    16.         "productInfo": "青年作者黎幺短篇小说首度结集",
    17.         "productPrice": 54.26,
    18.         "productCount": 2,
    19.         "id": "0002"
    20.     },
    21.     {
    22.         "isSelected": true,
    23.         "productCover": "https://img3.doubanio.com/view/subject/m/public/s33474961.jpg",
    24.         "productName": "绕日飞行",
    25.         "productInfo": "驯马、飞行、成长、爱情",
    26.         "productPrice": 22.67,
    27.         "productCount": 3,
    28.         "id": "0003"
    29.     }
    30. ]
    1. //index.html
    2. <body>
    3.     <div id="app">
    5.     </div>
    6.     <script>
    7.         var vm = new Vue({
    8.             el: "#app",
    9.             data:{
    10.                 products:[]
    11.             },
    12.             mounted(){
    13.                 axios.get('./data/carts.json').then(res=>{
    14.                     this.products = res.data
    15.                 })
    16.             }
    17.         })
    18.     </script>
    19. </body>