vue入门第二天，后端程序员需要掌握的vue技术，五天带你玩转vue

1.前言

有了第一天对vue的一些基本认识，如果你有了以下的认识，说明你已经入门vue了

1.0Vue.js是数据驱动的，这使得我们并不需要直接操作DOM，不要再有操作dom的思想了，忘掉以前jquery的思想

1.1.在Vue中，已经实现了数据的双向绑定，每当我们修改了 data 中的数据，Vue会默认监听到数据的改动，自动把最新的数据，应用到页面上；

1.2 当我们意识到上面两点的时候，就证明大家已经入门Vue了，我们更多的是在进行 VM中 Model 数据的操作，同时，在操作Model数据的时候，指定的业务逻辑操作；

2.今日学习目标

第一天我说，我们要成为一个全栈程序员，何为全栈，就是很多东西都要会，但是一定要有我们自己的主项，但是作为一个后端程序员，我们的主项就是写接口，处理业务逻辑，前端的代码不需要我们写，但是我们一定能看懂，知道代码到底写在哪里，个人觉得，作为一个后端程序员需要熟悉vue的指令，熟悉vue的异步调用，知道路由规则，知道一个增删改查的流程是什么样的就可以了，不用纠结vue的各种自定义指令，过滤器，组件，这些都是专业的人干的事，我们这种外行能看懂，了解就行，这一天基本都是需要让大家了解的东西，让大家知道有这个概念，以后和别人聊天不尴尬

3.vue的过滤器

4.vue的生命周期

• 什么是生命周期：从Vue实例创建、运行、到销毁期间，总是伴随着各种各样的事件，这些事件，统称为生命周期！

• 生命周期钩子：就是生命周期事件的别名而已；

• 生命周期钩子 = 生命周期函数 = 生命周期事件

• 主要的生命周期函数分类：

• 创建期间的生命周期函数：

  • beforeCreate：实例刚在内存中被创建出来，此时，还没有初始化好 data 和 methods 属性

    • created：实例已经在内存中创建OK，此时 data 和 methods 已经创建OK，此时还没有开始 编译模板

    • beforeMount：此时已经完成了模板的编译，但是还没有挂载到页面中

    • mounted：此时，已经将编译好的模板，挂载到了页面指定的容器中显示

• 运行期间的生命周期函数：

  • beforeUpdate：状态更新之前执行此函数， 此时 data 中的状态值是最新的，但是界面上显示的 数据还是旧的，因为此时还没有开始重新渲染DOM节点

    • updated：实例更新完毕之后调用此函数，此时 data 中的状态值 和 界面上显示的数据，都已经完成了更新，界面已经被重新渲染好了！

• 销毁期间的生命周期函数：

  • beforeDestroy：实例销毁之前调用。在这一步，实例仍然完全可用。

    • destroyed：Vue 实例销毁后调用。调用后，Vue 实例指示的所有东西都会解绑定，所有的事件监听器会被移除，所有的子实例也会被销毁。

 

5.vue的异步调用方式（vue-resource和axios）

 

5.1vue-resource特点

使用：

2.引入vue-resource后，可以基于全局的Vue对象使用http，也可以基于某个Vue实例使用http。

3.在发送请求后，使用then方法来处理响应结果，then方法有两个参数，第一个参数是响应成功时的回调函数，第二个参数是响应失败时的回调函数。
then方法的回调函数也有两种写法，第一种是传统的函数写法，第二种是更为简洁的ES 6的Lambda写法

4.调用的方式代码

get方式：

post方式，put，delete等方式也是一样的，就不过多的介绍了，主要介绍axios

6.axios介绍

vue2.0之后，就不再对vue-resource更新，而是推荐使用axios。基于 Promise 的 HTTP 请求客户端，可同时在浏览器和 Node.js 中使用。

post请求：

respon返回的数据，可以在then里面获取