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(){
});
},
deletefunction(){
$.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:组件模板

原文地址:https://www.cnblogs.com/RealWorld/p/9330487.html