Vue中的条件渲染

2023-05-18 10:47:48

Vue中的条件渲染

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

<script>
export default {
  data() {
    return {
      isShow: true
    }
  }
}
</script>

Vue中的列表渲染

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

<script>
export default {
  data() {
    return {
      list: ['item1', 'item2', 'item3']
    }
  }
}
</script>
  • 作者：
  • 原文链接：
    更新时间：2023-05-18 10:47:48