Vue axios的使用

忘是亡心i 2024-03-03 06:55 153阅读 0赞

<template>
        <div>
            <div v-if="!repositoryUrl">loading...</div>
            <div v-else>most star repository is <a :href="repositoryUrl" rel="external nofollow"  rel="external nofollow" >{
        {
        repositoryName}}</a></div>
        </div>
        
    </template>
    
    <script>
        import axios from 'axios';
        
        export default {
        
            data() {
        
                return {
        
                    repositoryUrl : '',
                    repositoryName : ''
                }
            },
            
            mounted() {
        
                // 发ajax请求，用以获取数据，此处地址意思是查询 github中 vue 星数最高的项目
                const url = 'https://api.github.com/search/repositories?q=vue&sort=stars';
                
                axios.get(url).then(
                    response => {
        
                        const result = response.data.items[0];
                        console.log(result)
                        this.repositoryUrl = result.html_url;
                        this.repositoryName = result.name;
                    }
                ).catch(
                    response => {
        
                        alert('请求失败');
                    },
                );
            }
        }
    </script>
    
    <style>
    
    </style>

post使用

const url = '/api/v1/web3/url/list_by_category';
    
    let data = {
        "category":"tools"};
    
    axios.post(url,data).then(
      response => {
        
        const result = response.data.data;
        console.log(result)
        this.repositoryName = result.name;
        this.web3_urls = result
    
    
      }).catch(response => {
        
        alert('请求失败');
      },
      );

发表评论取消回复

表情：

评论列表（有 0 条评论，153人围观）

还没有评论，来说两句吧...

相关阅读

相关 vue中使用axios

\Axios是什么？ 1.支持Promiss API 2.拦截请求和响应 3.转换请求数据和响应数据 4.取消请求 5.自动转换json数据 6....

素颜马尾好姑娘i/ 2024年04月17日 18:58/ 0 赞/ 125 阅读

相关 Vue axios的使用

<template> <div> <div v-if="!repositoryUrl">loading...</div>

忘是亡心i/ 2024年03月03日 06:55/ 0 赞/ 154 阅读

相关 vue 全局使用axios

在main.js中 import axios from 'axios' Vue.prototype.$axios= axios; // axios 改写为 V

「爱情、让人受尽委屈。」/ 2023年06月15日 11:25/ 0 赞/ 55 阅读

相关 vue中使用axios

1. 安装 npm install --save axios 2.导入 import axios from "axios"; 3.使用 cre

不念不忘少年蓝@/ 2023年06月11日 05:26/ 0 赞/ 69 阅读

相关 Vue的axios使用说明

下载axios： npm install axios --save 导入axios： import axios from "axios";

￡神魔★判官ぃ/ 2023年02月28日 01:25/ 0 赞/ 11 阅读

相关 VUE使用axios

1，npm一下 npm install vue-axios --save npm install qs.js --save　　//这一步可以先忽略，它的作用是

雨点打透心脏的1/2处/ 2022年12月12日 13:53/ 0 赞/ 204 阅读

相关 vue之axios使用

一、安装 1、利用npm安装`npm install axios --save` 2、利用bower安装`bower install axios --save`

雨点打透心脏的1/2处/ 2022年06月13日 00:14/ 0 赞/ 342 阅读

相关 axios + webpack + vue。 axios基本使用

目的：在wepack+vue 项目中使用 axios 第一步：安装 cnpm i axios -S 第二步：导入 2-1导入：import axi

Dear 丶/ 2022年05月14日 09:20/ 0 赞/ 371 阅读

相关 vue.js axios的使用

首先安装：npm install axios --save vue源码： <script> import axios from '@/axios'

怼烎@/ 2022年04月25日 02:26/ 0 赞/ 304 阅读

相关 vue 全局使用 axios

vue 全局使用 axios，可以直接在 main.js 中引入 axios；也可以对 axios 进行封装，封装之后再引入到 main.js 中。总之要想全局使用，就得引入到

水深无声/ 2022年01月26日 14:25/ 0 赞/ 650 阅读