<div id="app">
<ul>
<li v-for="item in items" >
<img :src="item.url"><p class="title">{{ item.createdAt}}</p>
<p class="time">{{ item.publishedAt }}</p>
</li>
</ul>
</div>
<script type="text/javascript">
$.ajax({
url:'https://www.apiopen.top/meituApi?page=1',
type:'GET',
dataType:'json',
success:function(data, status){
var pictures = data['data']
console.log(pictures[0]['url'])
new Vue({
el:'#app',
data:{
items:pictures,
},
})
},
async:true!
})
如果楼主的提供的信息无误的话, 那么错误应该可能是 图片本身不被允许加载(被静态资源拦截了)
检测方法
1:审查一下元素,查看图片节点的src属性是否正确;
2:查看网络请求,确认图片的请求返回值正确