简陋的 ASP.NET CORE 单页Web应用程序“框架”

2021-06-09 07:01

阅读：660

YPE html>

标签：netcore cti ref core 模式 rip mvc name menu

我对ASP.NET CORE了解不多，不知道是不是重复造轮子，也或者什么也不是，这个Demo是这样的：

1、非常简单或者说原始；
2、将单页Web应用增加了一个页（Page）概念（相当于MVC的 View）

3、Ajax无刷新跳转到新 Page，并支持H5浏览器刷新 Page、前进后退到其它 Page
4、类 MVC 开发模式，Action 提供 Data，Js 渲染 View，Data 和 View 开发分离

完整代码可以访问 https://github.com/fonshen/Fonshen.SPA

都是很简单的东西，好像没什么好说的，直接看核心应用代码：

一、单页的基础页面 /View/Shared/Default.cshtml 展示了一个菜单，点击菜单无刷新切换到新栏目，新栏目可以刷新，后退前进

二、控制器类，每一个 return this.Page(data) 的 Action 对应一个 Page

using Fonshen.SPA.Extensions;
using Microsoft.AspNetCore.Mvc;

// For more information on enabling MVC for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860

namespace Fonshen.SPA.Controllers
{
    public class HomeController : Controller
    {
        // GET: //
        public IActionResult Index()
        {
            var data = new
            {
                content = "index"
            };
            return this.Page(data);
        }

        public IActionResult About(int id)
        {
            var data = new
            {
                content = "about",
                page = id
            };
            return this.Page(data);
        }

        public IActionResult Contact()
        {
            var data = new
            {
                content = "contact"
            };
            return this.Page(data);
        }
    }
}

三、3个Action 对应3个 Js 渲染文件

// /js/Home/Index.js 文件负责渲染 Index Action
// Page.Data 对应服务端的 data
Page.Render = function () {
    Page.Body.html("Index:" + Page.Data.content);
};

// /js/Home/About.js 文件 负责渲染 About Action
Page.Render = function () {
    Page.Body.html("About->第" + Page.Data.page + "页");
};

// /js/Home/Contact.js 文件 负责渲染 Contact Action
Page.Render = function () {
    Page.Body.html("Contact:" + Page.Data.content);
};

简陋的 ASP.NET CORE 单页Web应用程序“框架”

标签：netcore cti ref core 模式 rip mvc name menu

原文地址：http://www.cnblogs.com/fonshen/p/7301108.html

上一篇：Python安装及配置

下一篇：asp.net mvc中配置路由默认值（Area中）

文章来自：搜素材网的编程语言模块，转载请注明文章出处。
文章标题：简陋的 ASP.NET CORE 单页Web应用程序“框架”
文章链接：http://soscw.com/index.php/essay/92565.html

亲，登录后才可以留言！

简陋的 ASP.NET CORE 单页Web应用程序“框架”

评论

热门文章

推荐文章

最新文章

置顶文章