Vue 入门-认识 Vue

🎊 什么是 MVVM 架构？

link：廖雪峰的官方网站-MVVM

**笔记:**通过 javascript 直接操纵数据，前端只负责纯展示。Model 和 Visual 分离。

🎊 为什么学习 Vuejs？

**笔记:**对原有项目进行重构。或者通过 Vuejs 开发新项目。目前的前端学习趋势。

🎊 官方网站？

link:https://cn.vuejs.org/

🎊Vue 的交互体验比 jquary 丰富？

**笔记:**Vue 是一个渐进式开发框架，可以与 jquary 共存。打个比方，如果你要重构一个基于 jquery 或者原生 js 开发的项目，你可以一个页面一个页面进行重构而不用太担心会出现兼容问题。至于交互的丰富性后面的学习会提及。

🎊 什么是 Vue 全家桶？

**笔记:**比如 Core+Vue-route+Vuex。可以满足各种各样需求。

🎊Vue 高级功能？

笔记:

解耦视图和数据

可复用组件

前端路由技术

状态管理

虚拟 DOM

👉 尚未解明

Vue 入门-Vue 安装方式

🎊CDN 引入

开发环境版本

1
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

生产环境版本

1
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.12"></script>

🎊 下载引入

开发环境版本

https://cn.vuejs.org/js/vue.js

生产环境版本

https://cn.vuejs.org/js/vue.min.js

🎊NPM 安装

通过 webpack 和 CIL 的使用，使用该方法。

Vue 初体验-Hello Vue

🎊ES6 声明变量？var 和 let、const 有什么区别？

笔记:

https://www.jianshu.com/p/4e9cd99ecbf5

  • var 用以声明一个变量，并且同时我们可以在声明语句中初始化所声明的变量。
  • let 语句在一个块级范围里声明一个局部变量。和 var 类似，我们可以在声明时初始化它的值。
  • const 语言中的变量只能被赋值一次，然后就不能在被赋值。const 语句的作用范围和 let 语句一样。

在使用时，尽量少用 var。

🎊 什么是命令式编程？什么又是声明式编程？

命令式编程即是原有的原生 js、jquery 开发模式。① 创建 div 元素，设置 ID② 定义变量 ③ 将变量放在 div 中显示。如：

1
2
3
4
5
<div id="app"></div>     //创建div元素，设置ID
<script>
var str = "你好世界！"     //定义变量
$("#app").text(str)      //将变量放在div中显示
<script>

声明式编程即是现有的 vuejs 的模式，通过 vue 来对数据进行管理。如：

1
2
3
4
5
6
7
8
9
<div id="app">{{message}}</div>
<script>
    const app = new Vue({
        el:'#app',
        data:{
            message:'你好！'
        }
    })
</script>

🎊vue 代码做了什么？

① 运用 const 创建了一个 vue 对象。

② 给 vue 对象传入了参数。

参数一：“el”定义了 vue 的挂载区域。

参数二：“data”定义了存储的数据。