Vue 结构

 

var vm = new Vue({
el: '#vue_det', // DOM 元素中的 id,改动全部在这个指定id的元素内，外部不受影响。
data: {//用于定义属性，实例中有三个属性分别为：site、url、alexa。

},
methods: {//用于定义的函数，可以通过 return 来返回函数值。
start: function(){    
},
get：function(){
$.getJSON("${BaseContextPath}/..."+data, data)
.done(function(res){
})
.fail(function(){
});
},
post：function(){
$.mPostJSON("${BaseContextPath}/...."+data, JSON.stringify(data))
.done(function(res){
})
.fail(function(){
});
},
delete：function(){
$.mDelete("${BaseContextPath}/..."+data, data)
.done(function(res){
})
.fail(function(){
});
}
},
filters: {//过滤器函数

},
computed: {//计算属性关键词

},
watch : {//监听属性,通过 watch 来响应数据的变化

},
components: {//组件可以扩展 HTML 元素，封装可重用的代码

},
directives: {//在实例使用 directives 选项来注册局部指令，这样指令只能在这个实例中使用

},
mounted:function(){//打开页面首先调用的方法
this.start(); //methods中的方法
}

})

1、Vue实例常用属性
（1）数据
data:Vue 实例的数据对象
components：Vue实例配置局部注册组件
（2）类方法
computed:计算属性
watch：侦听属性
filters：过滤器
methods:Vue实例方法
render：渲染函数，创建虚拟DOM
（3）生命周期
created：在实例创建完成后被立即调用，完成初始化操作
mounted：el挂载到Vue实例上了，开始业务逻辑操作
beforeDestroy：实例销毁之前调用
2、Vue组件
props:用于接收来自父组件的数据
template：组件模板