uniapp 常用的指令语句

uniapp 是一个使用 Vue.js 开发的跨平台应用框架，因此，它继承了 Vue.js 的大部分指令。以下是一些在 uniapp 中常用的 Vue 指令语句及其用途：

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

   • 条件渲染。v-if 有条件地渲染元素，v-else-if 和 v-else 用于处理多个条件分支。

2. v-for

   • 列表渲染。基于一个数组渲染一个列表，类似于 JavaScript 中的 map 函数。

3. v-bind / :

   • 动态属性绑定。动态地将一个或多个属性绑定到表达式。

4. v-model

   • 表单输入绑定。创建双向数据绑定，类似于 Vue 的 v-model。

5. v-on / @

   • 事件监听器。监听一个或多个事件，并将其绑定到当前实例的方法。

6. v-text

   • 文本绑定。将数据绑定到元素的文本内容。

7. v-html

   • HTML 绑定。将数据绑定到元素的 HTML 内容。

8. v-once

   • 单次绑定。使用它的元素或组件只渲染一次，并且不再跟踪变化。

9. v-pre

   • 跳过这个元素和它的子元素的编译过程。

10. v-cloak

    • 条件渲染。这个指令用于Vue的初始化阶段，它的作用是当DOM更新完成后会自动移除v-cloak属性。

以下是一些示例：

<!-- 条件渲染 -->
<template><div v-if="seen">现在你看到我了</div>
</template><!-- 列表渲染 -->
<template><div v-for="(item, index) in items" :key="index">{{ item.text }}</div>
</template><!-- 动态属性绑定 -->
<template><div :id="dynamicId"></div>
</template><!-- 表单输入绑定 -->
<template><input v-model="message" placeholder="编辑我...">
</template><!-- 事件监听器 -->
<template><button @click="reverseMessage">反转消息</button>
</template>

uniapp 也提供了自己的一些特定指令，例如：

• uni-open-location：打开地图选择位置。
• uni-nav-to：页面跳转。
• uni-message：显示消息提示框。

这些指令是基于 Vue 指令和 uniapp API 定制的，用于简化跨平台开发的特定操作。