网页
<link href="~/Content/css/bootstrap-theme.min.css" rel="external nofollow" rel="stylesheet" />
<link href="~/Content/css/bootstrap.min.css" rel="external nofollow" rel="stylesheet" />
<script src="~/Content/js/jquery-1.8.2.min.js"></script>
<script src="~/Content/js/bootstrap.min.js"></script>
<script src="~/Scripts/vue.min.js"> </script>
<script src="~/Scripts/axios.min.js"></script>
<style>
.red {
color: red;
} .blue {
background: blue;
}
</style><div id="app">
<button v-on:click="get">提交</button>
<ul>
<li v-for="item in list">
{{item.name}}
</li>
</ul> {{list.length}}
</div><script>
new Vue({
el: "#app",
data: {
list:[],
},
methods: {
get: function () {
var me = this;
axios.post("/home/get", {}).then(function (res) {
me.list = res.data;
})
}
}
})
</script>
控制器
public ActionResult get()
{
var list = new Users[]{
new Users() { name = "张三", age = },
new Users(){ name = "李四", age = },
new Users() { name = "王五", age = }
};
return Json(list, JsonRequestBehavior.AllowGet);
}