第一种方法(这种方法数据会重复,不知道啥原因,知道的可以评论告诉我)
首先要引入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
})
}
})
