【Vue第4章】Vue中的ajax_Vue2

目录

4.1 解决开发环境Ajax跨域问题

4.1.1 解决跨域的三种方法

4.1.2 使用代理服务器

4.1.3 笔记与代码

4.1.3.1 笔记

4.1.3.2 19_src_配置代理服务器

4.2 github用户搜索案例

4.2.1 效果

4.2.2 接口地址

4.2.3 笔记与代码

4.2.3.1 20_src_github搜索案例

4.3 vue项目总常用的2个Ajax库

4.3.1 axios

4.3.2 vue-resource

4.4 slot插槽

4.4.1 效果

4.4.2 理解

4.4.3 分类

4.4.4 笔记与代码

4.4.4.1 笔记

4.4.4.2 22_src_默认插槽

4.4.4.2 22_src_具名插槽

4.4.4.2 22_src_作用域插槽


4.1 解决开发环境Ajax跨域问题

常用的发送一个ajax请求的方式:

【Vue第4章】Vue中的ajax_Vue2_第1张图片

安装axios:

npm i axios

所谓跨域即违背了同源策略,同源策略规定了:协议名,主机名,端口号三者必须一致

【Vue第4章】Vue中的ajax_Vue2_第2张图片

4.1.1 解决跨域的三种方法

【Vue第4章】Vue中的ajax_Vue2_第3张图片

4.1.2 使用代理服务器

【Vue第4章】Vue中的ajax_Vue2_第4张图片

4.1.3 笔记与代码

4.1.3.1 笔记

【Vue第4章】Vue中的ajax_Vue2_第5张图片

4.1.3.2 19_src_配置代理服务器

【Vue第4章】Vue中的ajax_Vue2_第6张图片【Vue第4章】Vue中的ajax_Vue2_第7张图片

4.2 github用户搜索案例

4.2.1 效果

【Vue第4章】Vue中的ajax_Vue2_第8张图片

4.2.2 接口地址

https://api.github.com/search/users?q=xxx

4.2.3 笔记与代码

4.2.3.1 20_src_github搜索案例

【Vue第4章】Vue中的ajax_Vue2_第9张图片【Vue第4章】Vue中的ajax_Vue2_第10张图片【Vue第4章】Vue中的ajax_Vue2_第11张图片【Vue第4章】Vue中的ajax_Vue2_第12张图片【Vue第4章】Vue中的ajax_Vue2_第13张图片

4.3 vue项目总常用的2个Ajax库

4.3.1 axios

4.3.2 vue-resource

4.4 slot插槽

4.4.1 效果

【Vue第4章】Vue中的ajax_Vue2_第14张图片【Vue第4章】Vue中的ajax_Vue2_第15张图片

4.4.2 理解

4.4.3 分类

【Vue第4章】Vue中的ajax_Vue2_第16张图片

4.4.4 笔记与代码

4.4.4.1 笔记

【Vue第4章】Vue中的ajax_Vue2_第17张图片【Vue第4章】Vue中的ajax_Vue2_第18张图片

4.4.4.2 22_src_默认插槽

【Vue第4章】Vue中的ajax_Vue2_第19张图片【Vue第4章】Vue中的ajax_Vue2_第20张图片

4.4.4.2 22_src_具名插槽

【Vue第4章】Vue中的ajax_Vue2_第21张图片【Vue第4章】Vue中的ajax_Vue2_第22张图片【Vue第4章】Vue中的ajax_Vue2_第23张图片

4.4.4.2 22_src_作用域插槽

【Vue第4章】Vue中的ajax_Vue2_第24张图片【Vue第4章】Vue中的ajax_Vue2_第25张图片

你可能感兴趣的:(vue.js,前端)