指令

🆕 7.3 新增

v-t

  • 预期:string | Object

  • 修饰符:

    • .preserve:(8.7.0 新增) 当指令解除绑定时,保留元素 textContent
  • 详细:

更新使用语言环境信息进行本地化的元素 textContent。你可以使用字符串语法或对象语法。字符串语法可以指定为语言环境信息的关键字路径。如果可以使用对象语法,则需要将以下参数指定为对象键:

  1. * `path`:必填,语言环境信息的关键字
  2. * `locale`:可选,语言环境
  3. * `args`:可选,用于列表或命名格式

注意

v-t 指令解除绑定时,默认情况下将清除元素 textContent。在过渡动画指令 - 图1内部使用的时候,可能出现不合预期的情况。为了在指令解除绑定之后保留 textContent 数据,可使用 .preserve 修饰符或全局的 preserveDirectiveContent 选项

  • 示例:
  1. <!-- 字符串语法:字面量 -->
  2. <p v-t="'foo.bar'"></p>
  3. <!-- 字符串语法:通过数据或计算属性绑定 -->
  4. <p v-t="msg"></p>
  5. <!-- 对象语法: 字面量 -->
  6. <p v-t="{ path: 'hi', locale: 'ja', args: { name: 'kazupon' } }"></p>
  7. <!-- 对象语法: 通过数据或计算属性绑定 -->
  8. <p v-t="{ path: greeting, args: { name: fullName } }"></p>
  9. <!-- `preserve` 修饰符 -->
  10. <p v-t.preserve="'foo.bar'"></p>