vue 页面加载完自动请求ajax加载数据

第一种方法(这种方法数据会重复,不知道啥原因,知道的可以评论告诉我)

首先要引入vue.js

再引入axios.js 

<script src="/static/vue/kf_vue.js"></script>
<script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script>
<script>
new Vue({
	el: '#vue_list',
	data: {
		list: {}
	},
    // 事件区域
    created(){
      // 点击事件
    },
    //存放方法区域
    methods: {
    	// 创建convert方法
		convert:function () {
			axios.post("{:url('indexApi/client')}").then(res => {
                //ajax返回值赋值给 data中list
				this.list=res
			})
		}
    },
    //页面加载完自动加载区域
    mounted(){
        //自动加载convert方法
        this.convert();
    }
})
</script>

第二种方法

new Vue({
	el: '#vue_list',
	data: {
		list: {}
	},
    //数据渲染后的操作
    created(){
      // 点击事件
    },
    // 方法存放区
    methods: {
    	/*var that=this;
		convert:function () {
			axios.post("{:url('indexApi/client')}").then(res => {
				that.list=res
			})
		}*/
		/*function i_list(data){
			$.post("{:url('indexApi/client')}",data,function(e){
	        	console.log(e)
	        	that.list=e
	        })
		}*/
    },
    //页面加载完自动执行
    mounted(){
    	var that=this,data={}
        $.post("{:url('indexApi/client')}",data,function(e){
            // 赋值给data 中list
        	that.list=e
        })
    }
})