vue中的知识点总结 vue的v-if，v-else实现不同组件登录，键值分开。响应修改对象属性等。

最新推荐文章于 2022-11-20 19:00:49 发布

asdfwxy

最新推荐文章于 2022-11-20 19:00:49 发布

阅读量818

点赞数

分类专栏： vue

本文链接：https://blog.csdn.net/asdfwxy/article/details/102560304

版权

本文总结了Vue中的关键知识点，包括v-if/v-else用于切换组件登录，键值对处理，响应式修改对象属性，以及在v-for中的使用技巧，如配合key进行DOM更新，处理数组和对象的响应式问题，以及计算属性和方法在数据过滤和排序中的应用。

摘要由CSDN通过智能技术生成

1：使用username，或者邮箱登录。

<template v-if="loginType === 'username'">
  <label>Username</label>
  <input placeholder="Enter your username">
</template>
<template v-else>
  <label>Email</label>
  <input placeholder="Enter your email address">
</template>

Vue 为你提供了一种方式来表达“这两个元素是完全独立的，不要复用它们”。只需添加一个具有唯一值的 key 属性, 元素仍然会被高效地复用，因为它们没有添加 key 属性。

<template v-if="loginType === 'username'">
  <label>Username</label>
  <input placeholder="Enter your username" key="username-input">
</template>
<template v-else>
  <label>Email</label>
  <input placeholder="Enter your email address" key="email-input">
</template>

2：vue中多个对象，单个对象