diff --git a/docs/vue.md b/docs/vue.md index 578ba9f..e20801f 100644 --- a/docs/vue.md +++ b/docs/vue.md @@ -208,20 +208,6 @@ data() { </span> ``` -### 指令 Directives - -```html -<p v-if="seen">Now you see me</p> -``` - -### 参数 Arguments - -```html -<a v-bind:href="url"> ... </a> -<!-- 简写 --> -<a :href="url"> ... </a> -``` - ### 绑定事件 ```html @@ -269,6 +255,30 @@ v-on:submit.prevent="onSubmit" ╰─ Name 以 v- 开头使用速记时可以省略 ``` +### 指令 Directives + +```html +<p v-if="seen">Now you see me</p> +``` + +### 自定义指令 Directives + +```js +<script setup> +const vAdmin = { + created(el, binding, vnode, prevVnode) { + el.style.display = isAdmin ? 'block' : 'none' + }, +} +</script> + +<template> + <button v-admin>Settings</button> +</template> +``` + +更多指令函数参考:<https://vuejs.org/guide/reusability/custom-directives.html> + 响应式基础 ---