VUE 入门

练习 1 练习 2 练习 3 前往 VUE 入门教程

VUE 指令

练习 1 练习 2 练习 3 练习 4 练习 5 练习 6 练习 7 练习 8 练习 9 练习 10 练习 11 练习 12 练习 13 练习 14 前往 VUE 指令教程

VUE 方法

练习 1 练习 2 练习 3 前往 VUE 方法教程

VUE 计算属性

练习 1 练习 2 前往 VUE 计算属性教程

VUE 观察者

练习 1 练习 2 练习 3 前往 VUE 观察者教程

VUE 扩展

练习 1 练习 2 练习 3 练习 4 前往 VUE 扩展教程

VUE 组件

练习 1 练习 2 练习 3 练习 4 练习 5 练习 6 练习 7 练习 8 前往 VUE 组件教程

VUE 插槽

练习 1 练习 2 练习 3 前往 VUE 插槽教程

VUE 引用

练习 1 练习 2 前往 VUE 引用教程

VUE 生命周期钩子

练习 1 练习 2 前往 VUE 生命周期钩子教程

VUE 提供/注入

练习 1 练习 2 前往 VUE 提供/注入教程

VUE 路由

练习 1 练习 2 前往 VUE 路由教程

VUE 动画

练习 1 练习 2 练习 3 练习 4 前往 VUE 动画教程

VUE 构建

练习 1 练习 2 前往 VUE 构建教程

×

×

正确

练习：

<Transition> 组件可用于在元素之间切换时使用，以便在新元素变得可见时看起来很好，并在旧元素被移除时看起来很好。

填写空白，以便旧元素在添加新元素之前完全被移除：

<Transition mode="out-in"> <img src="/img_pizza.svg" v-if="imgActive === 'pizza'"> <img src="/img_apple.svg" v-else-if="imgActive === 'apple'"> <img src="/img_cake.svg" v-else-if="imgActive === 'cake'"> <img src="/img_fish.svg" v-else-if="imgActive === 'fish'"> <img src="/img_rice.svg" v-else-if="imgActive === 'rice'"> </Transition>

不正确

点击此处重试

正确

下一题 ❯

<Transition w3exercise_input_no_0
="w3exercise_input_no_1
">
  <img src="/img_pizza.svg" v-if="imgActive === 'pizza'">
  <img src="/img_apple.svg" v-else-if="imgActive === 'apple'">
  <img src="/img_cake.svg" v-else-if="imgActive === 'cake'">
  <img src="/img_fish.svg" v-else-if="imgActive === 'fish'">
  <img src="/img_rice.svg" v-else-if="imgActive === 'rice'">
</Transition>