与任何框架一样,Vue有几个奇怪的特征,新手可能需要一些时间来习惯,许多人会碰到,在这里,我们将尝试列出一些这些特征以及如何与它们合作或围绕它们。
安装 & 建筑
网站包
虽然Vue通常被称为一个进步的网页框架,允许你只使用你需要的零件,如果你想创建一个完整的应用程序,你肯定会想要一个适当的构建系统。
认识到 Webpack 对于初学者来说往往很难理解,Vue 提供 vue-cli来帮助您从一开始就为您的应用程序做好准备。
版本( 1 x 和 2 x )
与 Angular 1 和 Angular 2 不同,Vue 的两个主要版本,虽然改变了许多东西,但具有非常相似的用途,所以如果你不知道要寻找什么,你不会识别一个组件是为 Vue 1 或 Vue 2 编写的,因为 Vue 1 的编译分布式文件不会与 Vue 2 工作,反之亦然。
以下是部分版本为哪个版本编写的几个标志:
- 该组件是否具有 ready() (Vue 1) 或 mounted() (Vue 2) 方法?
- 该组件是否使用 v-bind.sync= 属性? 这些属性仅为 Vue 1
- 是否使用过滤器在 mustache 表达式({{}}) 外部使用? (即
@click="thing( ) debounce 200") 已在 Vue 2 中删除? - 是否在任何地方被定义或使用过部分? (Vue 1)
- 您是否看到任何 render() 函数? 虚拟 DOM (因此, render 方法) 已在 Vue 2 中添加到(MK1)
这些小差异的优点是,将组件从Vue 1到Vue 2的端口非常简单。
反应性
Vue的反應系統很棒,但它並不處理一切. Vue 無法偵測到的一些邊緣案例(但希望當 ES6 代理商得到廣泛支持時,這些警告會消失)。
- 当属性被添加或从一个对象中删除时,Vue 不会知道它,也不会使其反应 2.你不能直接将新属性添加到根数据对象中,但你可以使用 Vue.set(this.data, 'propname', 值) 3.Vue 无法检测某个特定索引值在数组中发生变化时,通过直接设置数组[index] = 值。
插件
如果您使用模块系统,请确保在尝试使用它们之前始终使用Vue.use(插件)。
寺庙
v-for 无钥匙
使用 v-for 对无密钥绑定对象的数组时,当数组发生变化时可能会产生一些非常奇怪的渲染,这是因为Vue 不知道如何识别没有密钥绑定而改变的对象。
分界者
*自定义划界选项(通过划界选项)仅在独立构建中可用(最常通过脚本标签加载的选项)。
HTML 插入。
许多人似乎不知道v-html绑定,它允许您将HTML作为元素的孩子。
** 注:** 您不能在注入的 HTML 中使用绑定和喜欢。
雷夫斯
元素上的 ref 属性允许您访问元素内部的渲染元素。 使用此代替 IDS,如果您真的需要它们!
希望这份名单有助于您!我们计划在未来根据需要扩展。