我在 Vue3 型別宣告中找到關于Directive,就是這個
export declare type Directive<T = any, V = any> = ObjectDirective<T, V> | FunctionDirective<T, V>;
相信大部分人都熟悉 ObjectDirective
export declare interface ObjectDirective<T = any, V = any> {
created?: DirectiveHook<T, null, V>;
beforeMount?: DirectiveHook<T, null, V>;
mounted?: DirectiveHook<T, null, V>;
beforeUpdate?: DirectiveHook<T, VNode<any, T>, V>;
updated?: DirectiveHook<T, VNode<any, T>, V>;
beforeUnmount?: DirectiveHook<T, null, V>;
unmounted?: DirectiveHook<T, null, V>;
getSSRProps?: SSRDirectiveHook;
deep?: boolean;
}
但那是什么FunctionDirective?
export declare type FunctionDirective<T = any, V = any> = DirectiveHook<T, any, V>;
export declare type DirectiveHook<T = any, Prev = VNode<any, T> | null, V = any> = (el: T, binding: DirectiveBinding<V>, vnode: VNode<any, T>, prevVNode: Prev) => void;
我試圖在官方檔案中找到一些有用的資訊,但沒有得到。
那么誰能告訴我這是什么以及如何使用它?
uj5u.com熱心網友回復:
有兩種宣告 Vue 指令的方法- 使用物件語法,在其中宣告指令感興趣的所有鉤子和函式語法,在其中傳遞函式并且該函式用于mounted和updated鉤子
因此使用以下命令宣告指令:
const hook = (el, binding) => {
// do some stuff
}
app.directive('my-directive', hook)
...與以下內容相同:
const hook = (el, binding) => {
// do some stuff
}
app.directive('my-directive', {
mounted: hook,
updated: hook,
})
轉載請註明出處,本文鏈接:https://www.uj5u.com/ruanti/406891.html
標籤:
下一篇:格式化嵌套資料JS
