VUE 开发——AJAX学习(二)

一、Bootstrap弹框

功能:不离开当前页面,显示单独内容,供用户操作

步骤:

  1. 引入bootstrap.css和bootstrap.js
  2. 准备弹框标签,确认结构
  3. 通过自定义属性,控制弹框显示和隐藏

部分添加:

结束前添加:

?

bootstrap的modal弹框:添加modal类名(默认隐藏)?




    
    title
    


    
    
     

  
  
  
    
      
        
          
Modal title
...

?二、图片上传

  1. 获取图片文件对象
  2. 使用FormData携带图片文件
  3. 提交表单数据到服务器,使用图片url网址

三、 XMLHttpRequest

定义:XHR对象用于与服务器交互,在AJAX编程中被大量使用

步骤:

  1. 创建XHR对象
  2. 配置请求方法和请求URl地址
  3. 监听loadend事件,接收响应结果

    

四、认识Promise?

?Promise:用于表示一个异步操作的最终完成(或失败)及其结果值

成功和失败状态,可以关联对应处理程序

成功调用:resolve(值)触发then()执行

失败调用:reject(值)触发catch()执行

五、Promise三种状态

一个Promise对象,必然处于以下几种状态之一:

待定(pending):初始状态,既没有被兑现,也没有被拒绝

已兑现(fulfilled):操作成功完成

已拒绝(rejected):操作失败

Promise对象一旦被兑现/拒绝,就是已敲定,状态无法再被改变?

六、封装axios函数


    

七、 同步代码和异步代码

同步代码:逐行执行,需原地等待结果后,才继续向下执行

异步代码:调用后耗时,不阻塞代码继续执行(不必原地等待),在将来完成后触发一个回调函数;例如setTimeout就是一个异步代码。

JS中的异步代码:

  • setTimeout/setInterval
  • 事件
  • AJAX

异步代码依靠回调函数接收结果

八、Promise——链式调用

使用then函数返回新Promise 对象特性,一直串联下去

上一篇:SEO初级|网站代码优化—iframe及Javascript(js)
下一篇:nova3i刷机包(华为nova3i忘记密码登不进去手机)