vue支持ajax吗

WBOY
Freigeben: 2022-07-01 16:47:05
Original
2959 人浏览过

vue本身是不支持ajax请求的,但是可以利用“vue-resource”、axios等插件实现vue发送ajax请求;axios是一个基于Promise的HTTP请求客户端,用于发送请求,“vue-resource”是一个插件用于提供使用XMLHttpRequest或JSONP进行Web请求和处理响应的服务。

vue支持ajax吗

本教程操作环境:windows10系统、Vue3版、Dell G3电脑。

vue支持ajax吗

vue本身不支持发送AJAX请求,需要使用vue-resource(vue1.0版本)、axios(vue2.0版本)等插件实现

axios是一个基于Promise的HTTP请求客户端,用来发送请求,也是vue2.0官方推荐的,同时不再对vue-resource进行更新和维护

vue-resource是Vue.js的插件提供了使用XMLHttpRequest或JSONP进行Web请求和处理响应的服务。 

当vue更新到2.0之后,作者就宣告不再对vue-resource更新,而是推荐的axios,在这里大家了解一下vue-resource就可以。

vue使用axios发送AJAX请求:

首页安装并引入axios

npm install axios -S
Nach dem Login kopieren

或者网上直接下载axios.min.js文件通过script src的方式进行文件的引入

Nach dem Login kopieren
import axios from 'axios'
import VueAxios from 'vue-axios'
Vue.use(VueAxios,axios);
Vue.prototype.$axios = axios;
Nach dem Login kopieren

*get请求

1、基本使用格式

格式1:axios([options]) #这种格式直接将所有数据写在options里

格式2:axios.get(url[,options])

2、传参方式:

通过url传参

通过params选项传参

代码片段:

    

    

注册账号

    

Nach dem Login kopieren
Nach dem Login kopieren

*post请求 (push,delete的非get方式的请求都一样)

格式:axios.post(url,data,[options]) 或者 axios([options])

Nach dem Login kopieren

index.js全局守卫

router.beforeEach((to,form,next) =>{
      //如果进入到的路由是登录页或者注册页面,则正常展示
      if (to.path === '/login') {
          next();
        } else {
          let token = window.sessionStorage.getItem('token');
          // console.log(token)
          if (token === null || token === '') {
            next('/login');
            // alert("还没有登录,请先登录!");
          } else {
            next();
          }
        }
      // console.log(to)
  })
Nach dem Login kopieren

【相关推荐:《vue.js教程》】

以上是vue支持ajax吗的详细内容。更多信息请关注PHP中文网其他相关文章!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!