将Json从ASP.Net MVC 5发送到Vue.js

我想开一家网上商店。我想在加载页面时显示产品列表。我在开发ASP.NETMVC5和Vue.js时使用。到目前为止，我有这个代码。如何让控制器在加载页面时发送JSON数据，并且Vue接受并将其作为列表分发

ASP.NET MVC控制器

public class HomeController : Controller
{
    IOrderService orderService;
    public HomeController(IOrderService serv)
    {
        orderService = serv;
    }
    public ActionResult Index()
    {
        return View();
    }
    public JsonResult GetAllItem()
    {
        IEnumerable<ItemDTO> itemDTOs = orderService.GetItems();
        var mapper = new MapperConfiguration(cfg => cfg.CreateMap<ItemDTO, ItemViewModel>()).CreateMapper();
        var items = mapper.Map<IEnumerable<ItemDTO>, List<ItemViewModel>>(itemDTOs);
        var jsondata = items;
        return Json(jsondata, JsonRequestBehavior.AllowGet);
    }

公共类HomeController:控制器
{
IOrderService命令服务；
公共家庭控制器（IOrderService serv）
{
orderService=serv；
}
公共行动结果索引（）
{
返回视图（）；
}
public JsonResult GetAllItem（）
{
IEnumerable itemDTOs=orderService.GetItems（）；
var mapper=newmapperconfiguration（cfg=>cfg.CreateMap（））.CreateMapper（）；
var items=mapper.Map（itemDTOs）；
var jsondata=项目；
返回Json（jsondata、JsonRequestBehavior.AllowGet）；
}

Vue.js Index.cshtlm

<script type="text/javascript">
window.onload = function () {
    var app = new Vue({
        el: '#app',
        data: {
            items: []
        },
        mounted() {
            Vue.axios.get('/GetAllItem').then((response) => { this.items = response.data })
        },
    })
}

window.onload=函数（）{
var app=新的Vue({
el:“#应用程序”，
数据：{
项目：[]
},
安装的（）{
Vue.axios.get（'/GetAllItem'）。然后（（响应）=>{this.items=response.data}）
},
})
}

---

不幸的是，我没有等待答案，但如果有人感兴趣，我会这样决定： 由Vue资源添加。在更改的Vue代码中：

Vue.axios.get（'/GetAllItem'）。然后（（response）=>{this.items=response.data}）

到

---

不幸的是，我没有等待答案，但如果有人感兴趣，我决定这样做： 由Vue资源添加。在更改的Vue代码中：

Vue.axios.get（'/GetAllItem'）。然后（（response）=>{this.items=response.data}）

到

this.$http.get('/Home/GetAllItem').then((response) => { this.items = response.data })