生命周期函数以及vue的全局注册

2023-03-07,,

beforeCreate 在创造实例之前
created 创造实例以后
beforeMount 在挂载前
render 渲染节点到页面上 //将虚拟dom数组渲染出来
mounted 挂载以后
beforeUpdate 修改之前
updated 修改以后 在这里不要进行数据的持续修改类似 +=类似的操作会引起死循环
beforeDestory 销毁之前 //用来释放非vue引起的资源。如setInterval();
destroyed 销毁之后 在组件激活 <keep-alive></keep-alive>时可以调用的钩子函数
activated
在组件卸载 <keep-alive></keep-alive>时调用的钩子函数
deactivated 在watch中可以深度监听 wacth:{ //深度监听是用来监听

但只是浅监听,只监听数据第一层或者第二层,

何为第二层?

let obj = {name: 'xx', child: {age: 11}};

    "obj.child.age":{
handler(newValue,OldValue)=>{
immediate:true,
deep:true //深度监听
}
}
}
var vm = new Vue({
data: {
a: 1,
b: 2,
c: 3
},
watch: {
a: function (val, oldVal) {
console.log('new: %s, old: %s', val, oldVal)
},
// 方法名
b: 'someMethod',
// 深度 watcher
c: {
handler: function (val, oldVal) { /* ... */ },
deep: true
}
}
})
vm.a = 2 // -> new: 2, old: 1
Vue API
全局配置(Vue.config)
silent
类型: Boolean
取消Vue所有的日志和警告
Vue.config.silent = false
=================
optionMergeStrategies
类型:Function
自定义合并策略的选项。
合并策略选项分别接受第一个参数作为父实例,第二个参数为子实例,Vue实例上下文被作为第三个参数传入。 Vue.config.optionMergeStrategies._my_option = function(parent, child, vm) {
return child + 1
}
const Profile = Vue.extend({
_my_option: 1
})
=================
Vue.directive(id, [definition])
注册或获取全局指令。 // 注册
Vue.directive('my-directive', {
bind: function () {},
inserted: function () {},
update: function () {},
componentUpdated: function () {},
unbind: function () {}
})
// 注册(传入一个简单的指令函数)
Vue.directive('my-directive', function () {
// 这里将会被 `bind` 和 `update` 调用
})
// getter,返回已注册的指令
var myDirective = Vue.directive('my-directive')
后端路由:根据用户的不同的请求返回不同的内容。
vue-router 是根据hash值实现的。
根据监听hashchange事件。
npm i vue-router --save
1)import VueRouter from "vue-router"
2) Vue.use(VueRouter)
3) new VueRouter

生命周期函数以及vue的全局注册的相关教程结束。

《生命周期函数以及vue的全局注册.doc》

下载本文的Word格式文档,以方便收藏与打印。