获取地址串信息：某些公司会提供一些地址串的接口，可以通过vue框架使用axios获取里面的值，并循环遍历
参考代码：
<!DOCTYPE html> <html> <head> <title>demo5 社区作业1</title> <meta charset="UTF-8"> <!--导包--> <script src="js/vue.js"></script> <script src="js/axios.min.js"></script> </head> <body> <div id="demo1"> <table> <!--{{msg}}可以打印看看是否拿到值--> <!--通过v-for方法，可以把msg的值赋值给item进行遍历--> <tr v-for="item in msg"> <td>{{item.title}}</td> <td>{{item.last_reply_at}}></td> <td>{{item.desc}}</td> </tr> </table> </div> </body> <script> var vm = new Vue({ //绑定div el:"#demo1", data:{ //声明属性 msg:[] },methods:{ //seach方法 seach:function(){ //通过axios,get方法获取地址的信息 axios.get("https://cnodejs.org/api/v1/topics").then( res=>{ //可以打印一下获取到的信息，看下是怎么样的结构 console.log(res.data.data); //把需要的参数赋值给之前声明的Msg this.msg=res.data.data; } ).catch( //错误异常 err=>{ this.msg=err.status; } ) } },mounted:function (){ //mounted是声明周期，在声明周期中执行方法 this.seach() } }); </script> </html> 其他案例网易接口：
<!DOCTYPE html>
<html>
<head>
<title>demo7 网易留言</title>
<meta charset="UTF-8">
<script src="js/vue.js"></script>
<script src="js/axios.min.js"></script>
</head>
<body>
<div id="demo1">
<!--{{msg}}}-->
<table>
<tr v-for="item in msg">
<td>{{item.commentTxt}}</td>
<td>{{item.createAt}}</td>
</tr>
</table>
</div>
</body>
<script>
var vm = new Vue({
el:"#demo1",
data:{
msg:[]
},
methods:{
seach:function(){
axios.get("http://api.artgoer.cn:8084/artgoer/api/v1/user/324380/v3/topic/topicHomeByLabel?pageIndex=1&token=b544cd63-6d42-46fe-a96c-3cf96bae3113&topicId=62187")
.then(
res=>{
//commentList是里面包装的一个集合名字，获取值之前先打印看看信息
this.msg=res.data.data.commentList;
console.log(res.data);
}
).catch(
err=>{
this.mag=err.status;
}
)
}
},
mounted:function () {
this.seach();
}
});
</script>
</html>
654
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
