<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <script src="js/vue.js"></script> <script src="js/axios.min.js" charset="utf-8"></script> <style type="text/css"> .red{color: #f00;font-weight: bold;} </style> <body> <div id="app"> <ul v-for="(item,index) in items" v-if="index<=5" v-bind:class="{red:index % 2 !=0}"> <li>{{item.pname}}</li> <li>{{item.pid}}</li> </ul> </div> <script type="text/javascript"> var app = new Vue({ el:"#app", data:{ items:"wwwww" }, created:function(){ //此函数先执行 var that = this; axios.get("1.json") .then(function(res){ that.items = res.data; console.log(this.items) }); } }); </script> </body> </html>