vue3中的指令及用法

Vue3中的指令和Vue2中基本相同，但是在一些细节上有所改变。以下是Vue3中常用的指令及用法：

1. v-if / v-else-if / v-else

<div v-if="isShow">显示内容</div>
<div v-else>隐藏内容</div>

2. v-for

<div v-for="(item, index) in list" :key="index">{{ item }}</div>

3. v-bind / :

<img :src="imgUrl" :alt="imgAlt">

4. v-on / @

<button @click="handleClick">点击我</button>

5. v-model

<input type="text" v-model="inputValue">

6. v-show

<div v-show="isShow">显示或隐藏内容</div>

7. v-html

<div v-html="htmlContent"></div>

8. v-slot / #

<template v-slot:header>
  <h1>头部内容</h1>
</template>

9. v-pre

<div v-pre>{{ 这里的内容不会被解析 }}</div>

10. v-cloak

<div v-cloak>{{ 这里的内容会被隐藏直到实例准备就绪 }}</div>