Vue使用

45 阅读2分钟

力求做到,只需要看此篇博文,不用再打开多页,涵盖不同段位知识点、大白话说原理。项目的话再单独写一篇吧。灵感借鉴自掘金博主林三心的系列文章。

黄金

1. Vue的优缺点?

优:渐进式,组件化,轻量级,虚拟dom,响应式,单页面路由,数据与视图分开

缺:单页面不利于seo,首屏加载时间长

2. Vue跟React的异同点?

相同:都使用了虚拟dom、组件化开发、都是单向数据流、都支持服务端渲染

不同点:React的JSX,Vue的template;数据变化,React手动(setState),Vue自动;React单向绑定,Vue双向绑定;React的Redux,Vue的Vuex

3. MVVM是什么?和MVC有何区别呢?

MVC:C将M的数据展示在V上

  • Model(模型):负责从数据库中取数据

  • View(视图):负责展示数据的地方

  • Controller(控制器):用户交互的地方,例如点击事件

MVVM:实现了 View 和 Model 的自动同步,也就是当 Model 的属性改变时,我们不用再自己手动操作 Dom 元素,来改变 View 的显示,而是改变属性后该属性对应 View 层显示会自动改变(对应Vue数据驱动的思想)

  • VM:也就是View-Model,做了两件事达到了数据的双向绑定:一是将Model(模型)转化成View(视图),即将后端传递的数据转化成所看到的页面。实现的方式是:数据绑定。二是将View(视图)转化成Model(模型),即将所看到的页面转化成后端的数据。实现的方式是:DOM 事件监听。

Vue是MVVM框架,但是不是严格符合MVVM,因为MVVM规定Model和View不能直接通信,而Vue的ref可以做到这点

4. Vue和JQuery的区别在哪?为什么放弃JQuery用Vue?

  • jQuery是直接操作DOM,Vue不直接操作DOM,Vue的数据与视图是分开的,Vue只需要操作数据即可
  • 在操作DOM频繁的场景里,jQuery的操作DOM行为是频繁的,而Vue利用虚拟DOM的技术,大大提高了更新DOM时的性能
  • Vue中不倡导直接操作DOM,开发者只需要把大部分精力放在数据层面上
  • Vue集成的一些库,大大提高开发效率,比如Vuex,Router等

钻石

1. 为什么data是个函数并且返回一个对象呢?

data之所以是一个函数,是因为一个组件可能会多处调用,而每一次调用就会执行data函数并返回新的数据对象,这样,可以避免多处调用之间的数据污染