Vue是什么？什么是MVVM?

1.Vue到底是个什么东西？

       很多人在学vue的时候都很困惑这玩意到底是什么为啥要这么写。其实它真的不难只是大家可能被网上的介绍吓住了。我们来看一下某权威网站关于vue介绍的截图如下：

是不是看着就不简单，就不想学？

       但其实vue真的是个简单的东西：它就是一个 javascript 语言基于面向对象的一个高级的用法而已？

现在我就来简单说一下：

1. 我们传统的网页是这样的：

看到没：就是我们写的网页就是用户看到的。

2.vue工程中的网页是这样的：

看到不同没：就是用户看到的页面不是程序员写的，而是vue对象生成的。

也就是在写vue的时候和传统的html写法是不一样的，写vue的时候更多是要考虑vue对象怎么写。

3.vue工程中的代码举例：

在一个vue工程中是有一个入口 js 的，叫main.js大家可以看一下它的基本写法就会明白：

import router from './router'
import store from './store'

new Vue({
  router,
  store,
  render: h => h(App)
}).$mount('#app')

有没有看到 new 关键字，这的确就是一个javascript的对象呀。

4. vue对象的生命周期简介:

正是因为vue 是一个javascript对象,因此它也是会有一个产生和销毁的过程（也就是生命周期）。

具体对应如下：

创建前：beforeCreate() 只有一些实例本身的事件和生命周期函数
创建后：created() 是最早使用data和methods中数据的钩子函数
挂载前：beforeMount() 指令已经解析完毕，内存中已经生成dom树
挂载后：mounted() dom渲的数据已经同步
更新前：beforeUptate() 当data的数据发生改变会执行这个钩子，内存中的数据是新的，页面是旧的
更新后：updated() 内存和页面都是新的
销毁前：beforeDestroy() 即将销毁data和methods中的数据此时还是可以使用的，可以做一些释放内存的操作
销毁后：destroyed() 已经销毁完毕

2.什么是MVVM

       MVVM是Model-View-ViewModel的简写，它是一种极度优秀的设计模式。它是Vue框架的理论基础。

M: 就是数据，是你要去处理的。

V: 就是视图，给别人看的。

VM: 就是把Model和View关联起来，这个事情就是Vue去干的。

代码举例：

data () {
            return {
              uobj:{
                  name:'tom'
              }
}

这一段代码就是 M , 是程序员要想办法去操作的。

页面上的显示效果：

这就是V,是给用户看的。

<p>用户名:<input type="text" name="name" v-model.lazy="uobj.name"/></p>

这一段代码其实就是VM,是我们利用vue的语法把数据（M）绑定到要显示的文本框中(V)。

3个联起来就是1个完整的MVVM了。