vue.js+axios请求的简单请求示例

复制代码
 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6     <script src="./vue.min.js"></script>
 7     <script src="./axios.min.js"></script>
 8 </head>
 9 <body>
10 
11 <div id="app">
12     <input type="button" value="获取笑话" @click="getJoke">
13     <p>
14         {{msg}}
15     </p>
16 </div>
17 <script>
18     var vm = new Vue({
19         el:"#app",
20         data:{
21             msg:"hello world",
22         },
23         methods:{
24             getJoke(){
25                 //axios.post('https://xxxxxx',{"usename":"小明"})
26                 axios.get("https://utumnfish.cn/api/joke")
27                 .then((response)=>{
28                     this.msg=response.data;
29                 })
30                 .catch((err)=>{
31                     this.msg=err.message;
32                 })
33             },
34 
35         }
36     })
37 </script>
38 </body>
39 </html>
复制代码

 

posted @   乔小生1221  阅读(1227)  评论(0编辑  收藏  举报
编辑推荐:
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
阅读排行:
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 记一次.NET内存居高不下排查解决与启示
· DeepSeek 开源周回顾「GitHub 热点速览」
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
点击右上角即可分享
微信分享提示