“Vue2+Vue3”的版本间的差异

2024年7月27日 (六) 12:50的版本

尚硅谷张天禹

1.vue 基础

2.vue-cli（vue 脚手架，专门做工程化开发）

3.vue-router（用于在 vue 当中实现前端路由）

4.vuex（当应用足够复杂时，借助它帮我们保管数据）

5.element-ui（好看的 UI 组件库）

6.vue3

Vue 是什么？

Vue 是一套用于构建用户界面的渐进式 JavaScript 框架。

对于“渐进式”的解释：

Vue 可以自底向上逐层的应用

简单的应用：只需要一个轻量小巧的核心库（压缩完只有100kb）。

复杂的应用：可以引入各式各样的 Vue 插件。

Vue 的特点

1.采用组件化模式，提高代码复用率、且让代码更好维护。

对于“组件化”的举例解释：

比如有一个页面，有三个板块：推荐活动、新闻、热门

就可以分开考虑、实现：Activity.vue、News.vue、Hot.vue

.vue 文件中可以包含 html 代码、css 代码、JS 代码

在 Vue 中，一个 .vue 文件就是一个组件。

2.声明式编码，让编码人员无需直接操作 DOM，提高开发效率。

对“声明式”的举例解释：

比如现在有数据：

[
  {id:'001',name:'张三',age:18},
  {id:'002',name:'李四',age:19},
  {id:'003',name:'王五',age:20}
]

还有容器：

<ul id="list"></ul>

@@ 第54行： / 第54行： @@
 .<u>'''声明式'''</u>编码，让编码人员无需直接操作 DOM，提高开发效率。
+对“声明式”的举例解释：
+比如现在有数据：<syntaxhighlight lang="json">
+[
+  {id:'001',name:'张三',age:18},
+  {id:'002',name:'李四',age:19},
+  {id:'003',name:'王五',age:20}
+]
+</syntaxhighlight>还有容器：<syntaxhighlight lang="html">
+<ul id="list"></ul>
+</syntaxhighlight>