<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>hello</title>
</head>
<body>
<div id="app">
{{products}}1
</div>
<script src="node_modules\vue\dist\vue.js"></script>
<!-- <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script> -->
<script src="node_modules/axios/dist/axios.js"></script>
<script>
let vm = new Vue({
el: '#app',
created(){ //在数据初始化会调用
this.getData();
},
methods:{
getData(){
axios.get('./test.json').then(res=> {//success
this.products=res.data;
},err=>{//error
console.log('error');
});
}
},
data: {
products: []
}
})
</script>
</body>
</html>附 Promise 用法
//resolve参数代表成功函数，reject参数表示失败函数
//Promise的实例就一个then方法，有两个参数
let p = new Promise((resolve,reject)=>{
let a='蘑菇';
resolve(a);
});
p.then((data)=>{console.log(data);},()=>{})