vue中axios的简单使用
程序员文章站
2022-07-02 16:54:27
...
1,本文是对axios的简单使用,并没有对axios进行封装
首先在vue项目安装axios,如下代码
npm install axios --save
2,直接使用axios
在axios请求之前:如下图所示。
在axios请求之后,得到数据,如下图所示。
代码如下:
<template>
<div>
<input type="button" value="axiosTest" @click="getAxiosData"/>
<br>
<div>
{{info}}
</div>
</div>
</template>
<script>
import axios from 'axios'
export default {
name: "axiosTest",
data(){
return {
info : {}
}
},
methods:{
getAxiosData(){
axios.get('https://api.coindesk.com/v1/bpi/currentprice.json')
.then(response => {
this.info = response.data;
console.log(response)
console.log("info==",this.info)
})
}
}
}
</script>
<style scoped>
</style>
推荐阅读
-
探索Vue高阶组件的使用
-
关于vue单文件中引用路径的处理方法
-
oracle 数据库中,应用程序里的连接探测语句的正确使用
-
如何使用jquery中的ready事件?ready事件实例用法
-
Linux中awk的使用方法详解
-
svg矢量图标在html中的使用, (知识点:1.通过h5中的css实现点击变色,2.一个svg文件包含多个图标)
-
详解python多线程、锁、event事件机制的简单使用
-
vue中watch和computed的区别与使用方法
-
html select 中的 option 下拉列表的宽度, IE8中不能自动适应宽度, 如何简单解决?_html/css_WEB-ITnose
-
Laravel中关于model validation的使用示例