Vue 应用实例的关键方法与配置案例二
目录
createApp
createSSRApp
app.mount
app.unmount
app.component
app.directive
Vue3.X自定义全局指令
Vue2.X自定义全局指令
app.use
app.mixin
非 VIP 用户能够免费下载博文资源
createApp
详见上一章节：Vue 应用实例的关键方法与配置案例一-CSDN博客
createSSRApp
详见上一章节：Vue 应用实例的关键方法与配置案例一-CSDN博客
app.mount
详见上一章节：Vue 应用实例的关键方法与配置案例一-CSDN博客
app.unmount
详见上一章节：Vue 应用实例的关键方法与配置案例一-CSDN博客
app.component
详见上一章节：Vue 应用实例的关键方法与配置案例一-CSDN博客
app.directive
Vue3.X自定义全局指令
在 Vue 3.0 中，app.directive 方法用于注册自定义指令。自定义指令可以让您对 DOM 元素进行更精细和特定的操作，增强了对页面元素的控制能力。与 Vue 2.x 相比，Vue 3.0 中的自定义指令在钩子函数的参数上有所变化，提供了更清晰和灵活的接口。
自定义指令的钩子函数包括：
created：在指令实例被创建时调用，此时还未绑定到元素。
beforeMount：在绑定到元素之前调用。
mounted：指令绑定到元素时调用。
beforeUpdate：在组件的 VNode 更新之前调用。
updated：组件的 VNode 更新之后调用。
beforeUnmount：在指令与元素解绑之前调用。
unmounted：指令与元素解绑时调用。
在这些钩子函数中，您可以获取到指令的相关参数，如元素节点、绑定的值、修饰符等，从而进行相应的操作。
示例代码如下：
<body>
<div id="app">
<p>段落</p>
<p v-highlight="'yellow'" v-if="isShow">这是一段需要突出显示的文字</p>
<button @click="isShow=!isShow">v-if显示隐藏</button>
<input type="text" v-focus v-show="flag"/>