渐进式JavaScript 框架。

官网。

模板语法

插值

  1. // 文本内容
  2. <div>
  3.   {{ msg }} {{ format(name)}} 
  4.   {{ isShow && 'xxx'}}
  5.   {{ xx ? 'xxx' : 'x' }}
  6. </div>
  7. // 原始 HTML。标签不会被转义。
  8. <span v-html="rawHtml"></span>
  9. // 属性
  10. <a :href="jumpUrl" :class="xxx">xx</a>
  11. <div :class="[activeClass, errorClass]"></div>

指令

条件渲染

  1. <div v-show="isShow"></div>
  3. <div v-if="isShow"></div>
  4. <div v-else-if="isShow"></div>
  5. <div v-else="isShow"></div>

循环

  1. <li v-for="item in items" :key="item.message">
  2.   {{ item.message }}
  3. </li>

事件

组件定义

组件生命周期

插槽

组件间通信