01、邂逅vue.js

1、Vue是一个渐进式的框架的理解？

问题一、vue.js的两个核心是啥？
问题二、对于Vue是一套构建用户界面的渐进式框架的理解

2、Vue.js安装

补充知识点：let 和 const
补充知识点：命令式编程和声明式编程的区别

3.vue案例：列表展示（v-for）

4、vue案例：计数器

技巧：快捷指令 div#app
问题：为什么使用vue实例中定义的数据，要使用this

4、Vue的MVVM

6、Vue实例options的含义
7、Vue的生命周期
8、Vue在开发中体现出来的特点
9 、vue template (模板)
9.1 设置缩进2个字符
9.2 快速生成vue模板
1、Vue是一个渐进式的框架的理解？
https://www.cnblogs.com/xiangxiang2020/p/12734547.html

渐进式代表的含义：没有多做职责之外的事。

Vue.js 只提供 vue-cli 生态中最核心的组件系统和双向数据绑定。像vuex、vue-router 都属于围绕 vue.js开发的库。

问题一、vue.js的两个核心是啥？
1、数据驱动，也叫双向数据绑定

采用 “数据劫持” 结合 “发布者-订阅者” 模式的方式，通过 “Object.defineProperty” 方法来劫持各个属性的setter,getter，在数据变动时发布消息给订阅者，触发相应的监听回调

2、组件系统

vue组件核心选项：

模板（template）：模板声明了数据和最终展现给用户的DOM之间的映射关系
初始数据（data）：一个组件的初始数据状态。对于可复用的组件来说，通常是私有状态
接受外部参数（props)：组件之间通过参数进行数据的传递和共享
方法（methods）: 对数据的改变操作一般都在组件的方法内进行
生命周期钩子函数（lifecycle hooks）: 一个组件会触发多个生命周期钩子函数
私有资源（assets）：Vue.js将用户自定义的指令、过滤器、组件等统称为资源。一个组件可以申明自己的资源。私有资源只有该组件和它的子组件可以调用
问题二、对于Vue是一套构建用户界面的渐进式框架的理解
渐进式的含义:没有多做职责之外的事

vue.js 只提供了 vue-cli 生态中最核心的组件系统和双向数据绑定，像vuex、vue-router 都属于围绕 vue.js开发的库

比如说，使用Angular，必须接受

必须使用它的模块机制
必须使用它的依赖注入
必须使用他的特殊形式定义组件
Angular带有较强的排他性，如果你的应用不是从头开始，而是不断考虑是否和其他东西集成，这些主张会带来困惑

比如说，使用React，必须理解

函数式编程的理念
需要知道什么是副作用
如何隔离副作用
什么是纯函数
它的侵入性看似没有Angular那么强，主要因为它是软性侵入

Vue与React、Angular的不同，它是渐进式的。

你可以在原有大系统的上面，把一两个组件改用它实现，当jQuery用；
也可以整个用它全家桶开发，当Angular用
2、Vue.js安装
安装Vue的方式有很多

方式一、直接CDN引入

可以选择开发环境版本还是生产环境版本

//开发环境版本，包含了有帮助的命令行警告

//生产环境版本，优化了尺寸和速度(压缩过的代码)

1
2
3
4
方式二、下载和引入

开发环境 https://vuejs.org/js/vue.js
生产环境 https://vuejs.org/js/vue.min.js
方式三、npm下载

后续通过webpack和CLI的使用，我们使用该方式

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
补充知识点：let 和 const
let 定义变量
const 定义常量
补充知识点：命令式编程和声明式编程的区别
命令式编程

例如你想通过点击改变页面中某一个元素，首先要获取按钮，再给按钮添加点击事件，获取要改变的元素，执行点击函数，改变元素达到自己的目的，这是一步一步的步骤操作，就如同给计算机发布命令，一步一步执行

//元素js的做法
1、创建div元素，设置id属性
2、定义一个变量叫message
3、将message变量放到div元素中显示
1
2
3
4
声明式编程（见上）

简单的说，你只需要告诉计算机，你要得到什么样的结果，计算机则会完成你想要的结果，以Vue为例，在页面中通过 {{ }} 显示一个data里面的变量，你只需要改变这个变量，页面就会跟着刷新，这就是你只需要结果，vue 内部去处理过程

区别？

问题：为什么使用vue实例中定义的数据，要使用this
定义 methods方法的时候，注意:

使用普通函数的方式，this指向Vue实例

使用箭头函数的方式，this指向window

普通函数

————————————————
版权声明：本文为CSDN博主「二旬」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/weixin_44572568/article/details/128823514

【无标题】二级目录二级目录二级目录二级目录相关推荐

2015计算机二级c语言题库,2015年计算机二级C语言题库找题目录
2015年计算机二级C语言题库找题目录找题目录第01套:int fun(___1___ *std) 第02套:void WriteText(FILE ___1___) 第03套: fprintf( ...
iview-admin二级目录只有一个时变成一级目录解决方法
一开始我以为是获取菜单时过滤了,检查过util.js的getMenuByRouter方法发现返回的数组没毛病然后开始找显示目录的文件,果然是显示时过滤的然后对side-menu.vue文件修改然 ...
计算机二级模板文档,江苏省计算机二级
江苏省计算机二级Tag内容描述: 1.江苏理工学院 -王建江苏省计算机等级考试二级 Visual FoxPro上机攻略目录项目.数据库和表操作知识点 . 1 查询知识点 . 6 菜单 ...
全国计算机等级考试二级office试题,全国计算机等级二级考试高级Office试题及答案...
全国计算机等级二级考试高级Office试题及答案 (27页) 本资源提供全文预览,点击全文预览即可全文预览,如果喜欢文档就下载吧,查找使用更方便哦! 34.9 积分 --一.单选题(共计 60 题)( ...
word文档生成目录的方法，word生成目录之后怎么修改页码
word文档生成目录步骤,包括撰写标题.层级化标题.插入空白页.引入目录四个步骤.word文档生成目录后怎么修改页码?自动生成的目录,可通过自动更新页码的方式修改页码,无须手动修改.接下来,以Micr ...
计算机二级office模拟操作试题,计算机二级Office模拟试题及答案
计算机二级Office模拟试题及答案一.选择题 1.汉字在计算机内部的传输.处理和存储都使用汉字的 A.字形码 B.输入码 C.机内码 D.国标码 2.存储24×24点阵的一个汉字信息,需要的字节数 ...
计算机二级office做题技巧,计算机二级office考点整理及做题技巧.pdf
计算机二级office考点整理及做题技巧.pdf 计算机二级计算机二级 officeoffice 考点整理及做题技巧考点整理及做题技巧 ------鹏程教育教研团队编写鹏程教育教研团队编写 WordW ...
表格二级计算机考试真题,计算机二级office真题及答案
为了今年的计算机二级office的考生能顺利通过考试,小编精心整理出一套二级office真题题库及答案,以供大家的参考和学习,也祝愿广大考生在此次计算机等级取得好成绩. 二级Office考试大纲: 1 ...
【C 语言】结构体 ( 结构体中嵌套二级指针 | 为结构体内的二级指针成员分配内存 | 释放结构体内的二级指针成员内存 )
文章目录一.结构体中嵌套二级指针 1.结构体中嵌套二级指针类型声明 2.为结构体内的二级指针成员分配内存 3.释放结构体内的二级指针成员内存二.完整代码示例一.结构体中嵌套二级指针 1 ...

【无标题】二级目录二级目录二级目录二级目录

文章目录