• vue2.0 axios交互


    vue使用axios交互时候会出现的问题大致有三个:

      1:本地调试跨域问题?

      2:post请求,传参不成功,导致请求失败?

      3:axios引用,在使用的组件里面引用

    解决方案:

      问题一:跨域?

        解决本地调试跨域问题?

        反向代理---- 这个需要自己在配置文件里面去改配置,有个config下面的index.js文件

        

        

        上图是没有修改的,至于具体怎么修改,可以百度下,当然如果实在不会的话就调试时候,先把代码写好, npm run build 打包给后台在他那调试

        怎么配置反向代理?

        


          target是你后台服务器地址 
          发请求的时候  url 写成 ' /api/后台接口地址'
      不清楚可看文档:  https://vuejs-templates.github.io/webpack/proxy.html

      问题二:post请求,传参不成功,导致请求失败?(get请求的话直接按文档来就行)

        为什么?

        原因:因为axios post请求时候传参时候和传统的ajax有点不一样,并不是form提交的方式,说的简单点在

            如果你请求的接口是这样的:http://localhost:8086/web/checkSkill/getSkillList?key=123&currentPageNo=1  那你就要做处理

            怎么处理:qs.stringify( );如下图

            

              

            当然了,使用之前你需要先把qs引用过来:

            

            至于需不需先 npm install qs --save 这个随你,好像都可以,

            还有一种就是可能后台需要接收的参数格式是json对象格式,那怎么办?看下图:

            

            就这样处理

        问题三:axios引用

            就是你在那个组件使用了交互需要你在这个组件里面先引用一下,

            就是import axios from 'axios'  我当时是在全局(main.js)里面就引用了一下,然后就开始在其他组件里面用了,发现不好使,才单独引用的,

    当然了,在使用axios之前还是不要忘了,先安装axios   npm install axios --save  具体的可以看文档!!!!

        

  • 相关阅读:
    .NET应用架构设计—工作单位模式(摆脱程序代码的重要思想,反击DDD)
    ext Window点击右上角的关闭(Xbutton)加入监控事件
    HDU 2008 数字统计
    HTML5 CSS3 精美案例 : 达到VCD盒个性幻灯片
    Oracle表操作 (未完待续)
    oracle 统计语句 与常见函数的归纳(未完待续)
    Oracle 存储过程的创建,及触发器调用存储过程
    Oracle 数据乱码
    按列合并结果集
    Struts2 全局结果集-全局result节点设置,package设置abstract=true的实现
  • 原文地址:https://www.cnblogs.com/lijuntao/p/7423790.html
Copyright © 2020-2023  润新知