Asp.net+Vue+EmelentUI的实现(一)框架搭建

上善若水

vue对于web端的开发优势是很明显的，特别是单页应用，响应、数据等都很明显，而且开发效率也高，又有很多资料可查、有社区的支持。但vue对于开发较大的项目时，则会显得笨重，因为编译成了单页应用，非常臃肿，首次加载变的很慢。而且在使用VS来开发时，虽然VS可以创建vue的项目，但是基于node.js来编译的，不好操作，而且经常出现卡死现象，于是就考虑有没有其他的方式来应用vue。

vue本质上是一个对UI的渲染，可以认为是view的渲染层，而emelent ui是基于vue的控件库，本上相关的js则可正常工作，对于网网请求可以通过vue-resource来达成，再加上asp.net构建的webapi来实现服务的请求，那么基本上是可以成型的，基于这样的思路，于是有了后面的开发实践。

1.新建一个空的web项目

2.使用nuget安装vue、vue-resource、vue.js.element.ui

安装后的项目可以看到ElementUI、vue、vue-resource

3.创建App_Start文件夹，添加WebApiConfig.cs的类，添加System.Web.Http的引用

WebApiConfig.cs的代码如下

1. /// <summary>
2. /// webapi的配置
3. /// </summary>
4. public static class WebApiConfig
5. {
6. /// <summary>
7. /// 注册
8. /// </summary>
9. /// <param name="config"></param>
10. public static void Register(HttpConfiguration config)
11. {
12. // Web API 配置和服务
14. // Web API 路由
15. config.MapHttpAttributeRoutes();
17. config.Routes.MapHttpRoute(
18. name: "DefaultApi",
19. routeTemplate: "api/{controller}/{action}/{id}",
20. defaults: new { id = RouteParameter.Optional }
21. );
22. }
23. }

复制代码

使用nuget安装AspNet.WebApi，否则config.MapHttpAttributeRou

来源：https://blog.csdn.net/xxdddail/article/details/89876055
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！