type
status
date
slug
summary
tags
category
icon
password
一、什么是Vue.js
构建用户界面的渐进式框架，采用自底向上逐层应用的设计，核心理念是：数据驱动视图，组件化开发
二、为什么学习流行框架
简单易学，轻量级框架
数据，结构，视图分离
虚拟DOM
三、框架和库的区别
框架：一套完整的解决方案，对项目的侵入性较大，如果需要更换框架，则需要重新架构整个项目
库：提供一些小的功能，对项目的侵入性较小，如果这个库不能满足需求，可以轻易地切换到其他库
四、MVC和MVVM的区别
1.MVC
后端分层开发的概念，
V代表view，视图层，作用发送数据，展示数据
c代表controller，调度层，作用：接收数据，响应数据，返回数据
m代表model，模型层，作用：与数据库打交道，处理数据
2.MVVM
前端视图层的概念
v代表view视图层，作用：展示数据
vm代表视图模型层view-model，作用：连接view视图和model模型层，承上启下作用
m代表model模型层，作用：数据的逻辑处理
五、vue.js的代码结构
1、展示数据方式
(1)插值表达式
(2)v-text和v-html的异同
相同点：都会覆盖元素原有的内容
不同点：v-html可以解析富文本，v-text不可以
2、属性绑定
v-bind: 简写 :
3、事件绑定
v-on: 简写 @
4、事件修饰符 在事件类型后面添加
.stop 阻止事件冒泡
.capture 添加事件捕获模式
.self 事件作用于本身的时候触发
.once 事件只会触发一次
.prevent 阻止默认事件
5、数据双向绑定
v-model
绑定表单控件
原理：
通过数据劫持结合发布者-订阅者模式来实现
通过Object.defineProperty()方法来劫持各个属性上面的getter和setter函数
当数据发生变化时，通知订阅者进行视图的更新
6、样式的使用
class样式
数组
对象
三目运算符
数组内置对象
style
数组
对象
函数的返回值
7、v-for和key属性
v-for 遍历数组，对象和数字
v-for=’(item,index) in arr’
:key=’[key属性]’
必须是数字或字符串
必须是唯一值
作用：提高重排效率，就地复用
8、v-if和v-show
相同点：都可以进行元素的显示和隐藏
不同点：v-if是删除DOM元素，v-show是通过display:none控制元素的显示隐藏
应用场景：一次或少次使用用v-if，多次使用用v-show
- 作者:昕昕丶未来不是梦
- 链接:https://pisce.buzz/article/web_vue2_01
- 声明:本文采用 CC BY-NC-SA 4.0 许可协议，转载请注明出处。