MVVM和MVC:
什么是mvvm和mvc
mvvm:model view view-model
mvvm 是一种设计思想。Model 层代表数据模型,也可以在 Model 中定义数据修改和操作的业务逻辑;View 代表 UI 组件,它负责将数据模型转化成 UI 展现出来,ViewModel 是一个同步 View 和 Model 的对象。
在 MVVM 架构下,View 和 Model 之间并没有直接的联系,而是通过 ViewModel 进行交互,Model 和 ViewModel 之间的交互是双向的, 因此 View 数据的变化会同步到 Model 中,而 Model 数据的变化也会立即反应到 View 上。
ViewModel 通过 双向数据绑定把 View 层和 Model 层连接了起来,而 View 和 Model 之间的同步工作完全是自动的,无需人为干涉,因此开发者只需关注业务逻辑,不需要手动操作 DOM, 不需要关注数据状态的同步问题,复杂的数据状态维护完全由 MVVM 来统一管理。
mvc:model view controller
mvvm 和 mvc 区别
mvc 和 mvvm 其实区别并不大。都是一种设计思想。主要就是 mvc 中 Controller 演变成 mvvm 中的 viewModel。mvvm 主要解决了 mvc 中大量的 DOM 操作使页面渲染性能降低,加载速度变慢,影响用户体验。和当 Model 频繁发生变化,开发者需要主动更新到 View
v-bind和v-model的区别
1.v-bind用来绑定数据和属性以及表达式,缩写为':' 2.v-model使用在表单中,实现双向数据绑定的,在表单元素外使用不起作用
vue-router 有哪几种导航钩子?
三种 全局导航钩子 router.beforeEach(to, from, next), router.beforeResolve(to, from, next), router.afterEach(to, from ,next) 组件内钩子 beforeRouteEnter, beforeRouteUpdate, beforeRouteLeave 单独路由独享组件 beforeEnter
active-class 是哪个组件的属性?
vue-router 模块的router-link组件
vue的优点:
1:低耦合
视图(View)可以独立于 Model 变化和修改,一个 ViewModel 可以绑定到不同的"View"上,当 View 变化的时候 Model 可以不变,当 Model 变化的时候 View 也可以不变。
2:独立开发
开发人员可以专注于业务逻辑和数据的开发(ViewModel),设计人员可以专注于页面设计,使用 Expression Blend 可以很容易设计 界面并生成 xml 代码。
3:可重用性
可以把一些视图逻辑放在一个 ViewModel 里面,让很多 view 重用这段视图逻辑。
4:可测试
界面素来是比较难于测试的,而现在测试可以针对 ViewModel 来写
简述vue生命周期的理解:
共8个阶段:创建前后,载入前后,更新前后,销毁前后
创建前/后:beforecreate阶段,vue实例的挂载元素el还没有
载入前/后:beforemount阶段,1vue实例的el和data都初始化了,但还是挂载之前为虚拟的dom节点,data.message还未替换。在mounted阶段,vue实例挂载完成,data.message成功渲染
更新前/后:当data变化时,会触发beforeupdate和updated方法
销毁前/后:在执行destroy方法后,对data的改变不会再触发周期函数,说明此时vue实例已经解除了事件监听以及dom的绑定,但是dom结构依然存在
路由之间跳转:
声明式(标签跳转)<router-link to="index">
编程式(js跳转) router.push(“index”)
懒加载(按需加载路由)
wbepack中提供了require.ensure()来实现按需加载,以前引入路由是通过import的方式引入,改为const定义的方式进行引入
不进行页面按需加载引入方式:
import home form'../../common/home.vue'
进行按需加载的引入方式:
const home = r => require.ensure([],() = >r (require('../../commmon/home.vue')))
自定义指令(v-check, v-focus) 的方法有哪些? 它有哪些钩子函数? 还有哪些钩子函数参数
全局定义指令:在 vue 对象的 directive 方法里面有两个参数, 一个是指令名称, 另一个是函数。 组件内定义指令:directives 钩子函数: bind(绑定事件出发)、inserted(节点插入时候触发)、update(组件内相关更新) 钩子函数参数: el、binding至少 4 种 vue 当中的指令和它的用法:
v-if(判断是否隐藏),v-for(把数据遍历出来),v-bind(绑定属性),v-model(实现双向绑定)