也没有啥重点，就是一些基本知识，有需要的可以看看，持续更新，希望能帮助您。
vue
- 对于MVVM的理解
1首先我们明白是什么： MVC
Model View Controller 是模型(model)－视图(view)－控制器(controller)的缩写
① Model（模型）表示应用程序核心（比如数据库记录列表）。
Model（模型）是应用程序中用于处理应用程序数据逻辑的部分。 通常模型对象负责在数据库中存取数据。
②View（视图）显示数据（数据库记录）。
View（视图）是应用程序中处理数据显示的部分。 通常视图是依据模型数据创建的。
③Controller（控制器）处理输入（写入数据库记录）。
Controller（控制器）是应用程序中处理用户交互的部分。 通常控制器负责从视图读取数据，控制用户输入，并向模型发送数据
mvc 是大后端思想的最主要的基本模型，thinkphp为典型案例。将不同的数据功能，以模块化思想，把不同数据模型，展示在显示层，将不同的西瓜分给不同的人去做。
更多 MVC、MTV、MVP、CBD、ORM
- MVVM :Model-View-ViewModel 本质上就是MVC 的改进版 MVVM 就是将其中的View 的状态和行为抽象化，让我们将视图 UI 和业务逻辑分开
组成
- 模型 模型是指代表真实状态内容的领域模型（面向对象），或指代表内容的数据访问层（以数据为中心）。
- 视图 就像在MVC和MVP模式中一样，视图是用户在屏幕上看到的结构、布局和外观（UI）。
- 视图模型 视图模型是暴露公共属性和命令的视图的抽象。MVVM没有MVC模式的控制器，也没有MVP模式的presenter，有的是一个绑定器。在视图模型中，绑定器在视图和数据绑定器之间进行通信。
- 绑定器 声明性数据和命令绑定隐含在MVVM模式中。在Microsoft解决方案堆中，绑定器是一种名为XAML的标记语言。绑定器使开发人员免于被迫编写样板式逻辑来同步视图模型和视图。在微软的堆之外实现时，声明性数据绑定技术的出现是实现该模式的一个关键因素
特点
- 低耦合。视图（View）可以独立于Model变化和修改，一个ViewModel可以绑定到不同的- "View"上，当View变化的时候Model可以不变，当Model变化的时候View也可以不变。
- 可重用性。你可以把一些视图逻辑放在一个ViewModel里面，让很多view重用这段视图逻辑。
- .独立开发。开发人员可以专注于业务逻辑和数据的开发（ViewModel），设计人员可以专注于页面设计，使用Expression Blend可以很容易设计界面并生成xaml代码。
- 可测试。界面素来是比较难于测试的，而现在测试可以针对ViewModel来写。
3既然都问了什么是mvvm就应该把原理说下
双向数据绑定怎么实现
重点 Object.defineProperty() 原理 vue的双向数据绑定的原理相信大家都十分了解；主要是通过ES5的Object对象的defineProperty属性；重写data的set和get函数来实现的 解析 双向数据编订 是采用数据劫持结合发布者-订阅者模式的方式 new一个新的mvvm
1实现一个数据监听器Observer，能够对数据对象的所有属性进行监听，如有变动可拿到最新值并通知订阅者
2实现一个指令解析器Compile，对每个元素节点的指令进行扫描和解析，根据指令模板替换数据，以及绑定相应的更新函数
3实现一个Watcher，作为连接Observer和Compile的桥梁，能够订阅并收到每个属性变动的通知，执行指令绑定的相应回调函数，从而更新视图
4new一个新的mvvm 入口函数
3 vue-router
动态路由匹配我们经常需要把某种模式匹配到的所有路由，全都映射到同个组件 例如我们有一个 goods 组件，对于所有 ID 各不相同的商品，都要使用这个组件来渲染。
动态路由
那么，我们可以在 vue-router 的路由路径中使用动态路径参数（dynamic segment）来达到这个效果：
{
path:"/two:id",
component:{template:"#b"},
},
嵌套路由
我们经常将动态路由和嵌套路由共同使用,嵌套路由即是在原路由的基础上增加一个 children ,children 是一个数组.并且我们还需要在原来的组件上添加< /router-view >来渲染 chlidren 里面的路由.
{
// name: 'Layout',
path: '/',
component: () => import('@/views/Layout'),
children: [{
name: 'home',
path: '',
component: () => import('@/views/home')
},
{
name: 'user',
path: '/user',
component: () => import('@/views/user')
},
]
},
命名路由
有时我们通过一个名称来标识一个路由显得更方便一些，特别是在链接一个路由，或者是执行一些跳转的时候。你可以在创建 Router 实例的时候，在 routes 配置中给某个路由设置名称。
const routes = [
{
path:"/login",
name:"login",
component:{template:"#a"}
},
]
要链接到一个命名路由，可以给 router-link 的 to 属性传一个对象：
<router-link :to="{ name: 'login'}">User</router-link>
2一句话就能回答的面试题 搬运
1.css只在当前组件起作用
答：在style标签中写入scoped即可 例如：<style scoped></style>
2.v-if 和 v-show 区别
答：v-if按照条件是否渲染，v-show是display的block或none；
3.和router的区别答：
4.vue.js的两个核心是什么？
答：数据驱动、组件系统
5.vue几种常用的指令
答：v-for 、 v-if 、v-bind、v-on、v-show、v-else
6.vue常用的修饰符？
答：.prevent: 提交事件不再重载页面；.stop: 阻止单击事件冒泡；.self: 当事件发生在该元素本身而不是子元素的时候会触发；.capture: 事件侦听，事件发生的时候会调用
7.v-on 可以绑定多个方法吗？
答：可以
8.vue中 key 值的作用？
答：当 Vue.js 用 v-for 正在更新已渲染过的元素列表时，它默认用“就地复用”策略。如果数据项的顺序被改变，Vue 将不会移动 DOM 元素来匹配数据项的顺序， 而是简单复用此处每个元素，并且确保它在特定索引下显示已被渲染过的每个元素。key的作用主要是为了高效的更新虚拟DOM。
9.什么是vue的计算属性？
答：在模板中放入太多的逻辑会让模板过重且难以维护，在需要对数据进行复杂处理，且可能多次使用的情况下，尽量采取计算属性的方式。好处：
①使得数据处理结构清晰；
②依赖于数据，数据更新，处理结果自动更新；
③计算属性内部this指向vm实例；
④在template调用时，直接写计算属性名即可；
⑤常用的是getter方法，获取数据，也可以使用set方法改变数据；
⑥相较于methods，不管依赖的数据变不变，methods都会重新计算，但是依赖数据不变的时候computed从缓存中获取，不会重新计算。
10.vue等单页面应用及其优缺点
答：优点：Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件，核心是一个响应的数据绑定系统。MVVM、数据驱动、组件化、轻量、简洁、高效、快速、模块友好。
缺点：不支持低版本的浏览器，最低只支持到IE9；不利于SEO的优化（如果要支持SEO，建议通过服务端来进行渲染组件）；第一次加载首页耗时相对长一些；不可以使用浏览器的导航按钮需要自行实现前进、后退。
11.怎么定义 vue-router 的动态路由? 怎么获取传过来的值
答：在 router 目录下的 index.js 文件中，对 path 属性加上 /:id，使用 router 对象的 params.id 获取。
网友评论