获取数据 ajax--axios 自己学习记录

306 阅读2分钟

先暂停了,搞不定,网上目前看的视频,和网页,没一个完全正真的说完,瞎JB扯,拿的数据全是自己写的PHP,再用自己的电脑做服务器,说没一个用见面上已经有API,拿到再分析好,先搞别的,后面再来处理。

前端中期重最要的一步,就是获取服务器上的数据到自己网页中, 获取数据(如:标题,内容,图片),然后再分配到网页中的各各地方

为什么用要ajax?

传统的网页(即不用ajax技术的网页),想要更新内容,或者提交一个表单,都需要重新加载整个网页,使用ajax技术的网页,通过在后台服务器进行少量的数据交换,就可以实现异步局部更新.

重要点:

1.发送信息表示你要获取到数据
2.收到信息后,解析分配到网页各各地方
3.获取到的数据类型有哪些

要处理的问题点:

1.

ajax

ajax 有两种, 一个是原生JS 的 ajax, 另一个是 jQuery 的 ajax.

工作流程: **

**

原生 JS ajax

先看一遍W3C: www.w3school.com.cn/ajax/index.…

就五步:
1.创建对象
2.请求对象
3.响应
4.

axios

使用前准备工作

方法一:
npm install axios
import Axios from 'axios'
Vue.use(Axios)

方法二: 
<script src="https://unpkg.com/axios/dist/axios.min.js"> </script>

基本使用

1.post 请求

axios({
    method:'post',
    url:'  api地址  ',
    
    // 上传的数据
    data:{                  
        firstName:'fred',
        lastName:'flintstone'
    }
});

2. get请求:
axios({
    method:'get',
    url:'  api地址  '
    
})

获取数据中会遇到的问题点:

获取到的数据 类型有哪些

jsonp

新手知识点补充处:

js.then()这个方法是什么意思:

    1.then() 方法是异步执行
    2.意思是:就是当.then()前的方法执行完后,再执行then()内部的程序,这样就避免了,数据没获取到等的问题.