没有在 v-if / v-if-else / v-else 中使用 key

如果一组 v-if + v-else 的元素类型相同,最好使用 key (比如两个 <div> 元素)。

默认情况下,Vue 会尽可能高效的更新 DOM。这意味着其在相同类型的元素之间切换时,会修补已存在的元素,而不是将旧的元素移除然后在同一位置添加一个新元素。如果本不相同的元素被识别为相同,则会出现意料之外的结果。

vue为组件样式设置作用域(局部)

对于应用来说,顶级 App 组件和布局组件中的样式可以是全局的,但是其它所有组件都应该是有作用域的。scoped 特性可以使css局部作用域,不受外界影响,不止要使用 scoped 特性,使用唯一的 class 名可以帮你确保那些三方库的 CSS 不会运用在你自己的 HTML 上。

避免 v-if 和 v-for 用在一起

永远不要把 v-if 和 v-for 同时用在同一个元素上。

一般我们在两种常见的情况下会倾向于这样做:

  • 为了过滤一个列表中的项目 (比如 v-for="user in users" v-if="user.isActive" )。在这种情形下,请将 users 替换为一个计算属性 (比如 activeUsers),让其返回过滤后的列表。
  • 比如 v-for="user in users" v-if="shouldShowUsers"。这种情形下,请v-if 移动至容器元素上 (比如 ul, ol)。

vue使用.env文件配置全局环境变量

关于文件名:必须以如下方式命名,不要乱起名,也无需专门手动控制加载哪个文件

.env 全局默认配置文件,不论什么环境都会加载合并

.env.development 开发环境下的配置文件

.env.production 生产环境下的配置文件

vue中路由在新的标签页打开

1
2
3
4
5
6
let routeData = this.$router.resolve({
name: 'commercialPreview',
query: {cylType: this.$route.query.cylType},
params: { id: this.id }
})
window.open(routeData.href, '_blank')
Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×