vue api 配置解析
2018年8月9日
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 |
name: 'TheHeader', components: { //添加组件 TheEntry }, directives : { //添加 directives 选项,自定义指令 title }, props: ['size', 'myMessage'], //props 可以是数组或对象,用于接收来自父组件的数据。props 可以是简单的数组,或者使用对象作为替代,对象允许配置高级选项,如类型检测、自定义校验和设置默认值 data() { return { //返回的数据 logo: {}, hehe: {} } }, computed{ //计算属性(改变属性)(转换属性)(有缓存的),将被混入到 Vue 实例中。所有 getter 和 setter 的 this 上下文自动地绑定为 Vue 实例。注意如果你为一个计算属性使用了箭头函数,则 this 不会指向这个组件的实例,不过你仍然可以将其实例作为函数的第一个参数来访问。计算属性的结果会被缓存,除非依赖的响应式属性变化才会重新计算。注意,如果某个依赖 (比如非响应式属性) 在该实例范畴之外,则计算属性是不会被更新的。 }, props: { //可以是数组或对象,用于接收来自父组件的数据。props 可以是简单的数组,或者使用对象作为替代,对象允许配置高级选项,如类型检测、自定义校验和设置默认值。 }, watch{ //监听属性,一个对象,键是需要观察的表达式,值是对应回调函数。值也可以是方法名,或者包含选项的对象。Vue 实例将会在实例化时调用 $watch(),遍历 watch 对象的每一个属性。 }, beforeCreate() { //在实例初始化之后,事件配置之前被调用,就是比created早 }, created() { //在实例创建完成后被立即调用 }, mounted:function(){ //el挂载到实例上后调用,一般我们的第一个业务逻辑会在这里 比created慢 }, methods: { //写自定义方法的地方 }, beforeDestroy: {//实例销毁之前调用,主要解绑一些使用addEventListener监听的事件等 }, beforeRouteEnter {// 是组件内的路由导航守卫,在确认渲染该组件的对应路由前调用。该守卫不能访问 this,但我们通过传一个回调给 next,就可以使用上面的 vm 来访问组件实例。守卫的参数说明如下: }, filters{ //数据筛选的方法 {{date|formatDate}} 竖线后的方法下载filters中,主要用与数据筛选 } |