安装axios

axios和vue-resource都是获取数据用的

安装

1. npm i axios --save

2. 哪里用哪里应用axios

 <scrip>

import Axios from 'axios';

export default{

3. 使用

   import Axios from 'axios';

    export default{
        data(){
            return {               
                list:[]
            }
        },
        methods:{

            getData(){
                
                var api='http://www.phonegap100.com/appapi.php?a=getPortalList&catid=20&page=1';
                Axios.get(api).then((response)=>{
                    this.list=response.data.result;
                }).catch((error)=>{
                    console.log(error);

                })

            }
        },
        mounted(){  /*生命周期函数*/

            this.getData();

        }
       

    }

</script>

 

 1 <template>
 2     <!-- 所有的内容要被根节点包含起来 -->
 3     <div id="home">
 4          首页组件
 5 
 6         <button @click="getData()">请求数据</button>
 7         <hr>
 8         <br>
 9        
10         <ul>
11             <li v-for="item in list">
12             
13                 {{item.title}}
14             </li>
15         </ul>
16     
17 
18     </div>
19 
20 </template>

 

转载于:https://www.cnblogs.com/sulanlan/p/9929655.html