1.项目目录

2.路由

根目录/routes/index.js -- 首页

const router = require('koa-router')();

router.get('/', async (ctx) => {

  await ctx.render('default/index');

})

// 注意 前台和后台匹配路由的写法不一样

router.get('/case', async (ctx) => {

  ctx.body = '案例'

})

router.get('/about', async (ctx) => {

  await ctx.render('default/about');

})

module.exports = router.routes();

根目录/routes/api.js -- api接口

const router = require('koa-router')();

router.get('/', async (ctx) => {

  ctx.body = {

    "title": "这是一个api"

  }

})

router.get('/newslist', async (ctx) => {

  ctx.body = {

    "title": "这是一个新闻接口"

  }

})

router.get('/focus', async (ctx) => {

  ctx.body = {

    "title": "这是一个轮播图的api"

  }

})

module.exports = router.routes();

根目录/routes/admin.js -- 后端管理

const router = require('koa-router')();

const user = require('./admin/user.js');

const focus = require('./admin/focus.js');

const newscate = require('./admin/newscate.js');

// 配置admin的子路由(层级路由)

router.get('/', async (ctx) => {

  ctx.body = '后台管理系统首页';

})

router.use('/user', user)

router.use('/focus', focus)

router.use('/newscate', newscate)

module.exports = router.routes();

根目录/routes/admin/user.js -- 用户

/**

 * 用户的增加修改删除

 */

const router = require('koa-router')();

router.get('/', async (ctx) => {

  // ctx.body = '用户首页';

  await ctx.render('admin/user/index');

})

router.get('/add', async (ctx) => {

  await ctx.render('admin/user/add');

})

router.get('/edit', async (ctx) => {

  await ctx.render('admin/user/edit');

})

router.get('/delete', async (ctx) => {

  ctx.body = '删除用户';

})

module.exports = router.routes();

根目录/routes/admin/focus.js -- 轮播图

/**

 * 轮播图的增加修改删除

 */

const router = require('koa-router')();

router.get('/', async (ctx) => {

  await ctx.render('admin/focus/index');

})

router.get('/add', async (ctx) => {

  await ctx.render('admin/focus/add');

})

router.get('/edit', async (ctx) => {

  await ctx.render('admin/focus/edit');

})

router.get('/delete', async (ctx) => {

  ctx.body = '删除轮播图';

})

module.exports = router.routes();

根目录/routes/admin/newscate.js -- 新闻分类

/**

 * 新闻分类的增加修改删除

 */

const router = require('koa-router')();

router.get('/', async (ctx) => {

  ctx.body = '新闻分类首页';

})

router.get('/add', async (ctx) => {

  ctx.body = '增加新闻分类';

})

router.get('/edit', async (ctx) => {

  ctx.body = '编辑新闻分类';

})

router.get('/delete', async (ctx) => {

  ctx.body = '删除新闻分类';

})

module.exports = router.routes();

3.视图

根目录/views/default/index.html

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <meta http-equiv="X-UA-Compatible" content="ie=edge">

  <title>Document</title>

</head>

<body>

  <h2>这是一个网站的首页</h2>

  <div>

    box

  </div>

</body>

</html>

4.入口文件

/**

 * koa 路由模块化

 */

const Koa = require('koa');

const router = require('koa-router')();

const path = require('path');

const render = require('koa-art-template');

// 引入子模块(子路由)

const admin = require('./routes/admin.js');

const api = require('./routes/api.js');

const index = require('./routes/index.js');

// 实例化

var app = new Koa();

// 配置 koa-art-template 模板引擎

render(app, {

  root: path.join(__dirname, 'views'),

  extname: '.html',

  debug: process.env.NODE_ENV !== 'production'

})

// 配置路由

// router.use('/', index)

router.use(index)

/**

 * /admin 配置子路由(层级路由)

 * /admin/user

 */

router.use('/admin', admin);

/**

 * /api/newslist 新闻列表的api

 */

router.use('/api', api); /*在模块里面暴露路由并且启动路由*/

// 启动路由

app.use(router.routes()).use(router.allowedMethods())

app.listen(8008);

.

koa 路由、视图模块化（二）的更多相关文章

  1. Laravel教程 二：路由,视图,控制器工作流程

    Laravel教程 二:路由,视图,控制器工作流程 此文章为原创文章,未经同意,禁止转载. View Controller 上一篇教程我们走了那么长的路,终于把Laravel安装好了,这一篇教程我们就 ...

  2. koa 路由模块化（一）

    1.项目目录 2.入口文件 根目录/app.js /** * koa 路由模块化 */ const Koa = require('koa'); const router = require('koa- ...

  3. koa 路由配置

    Koa 路由 路由(Routing)是由一个 URI(或者叫路径)和一个特定的 HTTP 方法(GET.POST 等) 组成的,涉及到应用如何响应客户端对某个网站节点的访问. 通俗的讲:路由就是根据不 ...

  4. Vue-初步了解vue-router的三要素：路由map 、路由视图、路由导航

    安装vue-router模块 使用vue-router前要先安装vue-router库 cnpm install vue-router –save 使用vue-router vue-router有三个 ...

  5. Xamarin XAML语言教程模板视图TemplatedView(二)

    Xamarin XAML语言教程模板视图TemplatedView(二) (2)打开MainPage.xaml文件,编写代码,将构建的控件模板应用于中TemplatedView.代码如下: <? ...

  6. 用Decorator控制Koa路由

    在Spring中Controller长这样 @Controller public class HelloController{ @RequestMapping("/hello") ...

  7. Eclipse的Debug各种视图介绍(二)

    本文链接:https://blog.csdn.net/u011781521/article/details/55000066    http://blog.csdn.net/u010075335/ar ...

  8. vue 路由视图，router-view嵌套跳转

    实现功能:制作一个登录页面,跳转到首页,首页包含菜单栏.顶部导航栏.主体,标准的后台网页格式.菜单栏点击不同菜单控制主体展示不同的组件(不同的页面). 配置router-view嵌套跳转需要准备两个主 ...

  9. Laravel 5系列教程二：路由,视图,控制器工作流程

    免费视频教程地址https://laravist.com/series/laravel-5-basic 上一篇教程我们走了那么长的路,终于把Laravel安装好了,这一篇教程我们就要进入Laravel ...

随机推荐

  1. docker容器生态技术链

    图片来源:https://blog.51cto.com/liuleis/2067116 说明:学习Docker容器技术,先纵向了解大致内容架构,再横向逐一分解涉及的各项技术内容,对容器所涉及的技术体系 ...

  2. Java必考题目之JVM面试题目和答案

    JVM内存模型 首先我们来了解一下JVM的内存模型的怎么样的: 1.堆:存放对象实例,几乎所有的对象实例都在这里分配内存 堆得内存由-Xms指定,默认是物理内存的1/64:最大的内存由-Xmx指定,默 ...

  3. 3.Linux常用基本命令

    1.帮助手册 man --help 2.日期类 data,cal -------------文件目录管理类的命令 3.显示当前目录  pwd 4.cd切换目录 cd ..    返回上级目录 cd / ...

  4. 数据总线&地址总线&控制总线

    数据总线 (1) 是CPU与内存或其他器件之间的数据传送的通道. (2)数据总线的宽度决定了CPU和外界的数据传送速度. (3)每条传输线一次只能传输1位二进制数据.eg: 8根数据线一次可传送一个8 ...

  5. A主机ping B主机发生了什么？

    计算机网络面试题:A主机ping B主机发生了什么? 众所周知,ping命令使用的是ICMP协议包,那么A主机ping B主机到底发生了什么呢? 1 ping介绍 ping(Packet Intern ...

  6. Mac上 intellij IDEA报错：Class JavaLaunchHelper is implemented in both /Library/Java/JavaVirtualMachines/jdk .jdk/Contents/Home/bin/java ( ) and /Library/Java/JavaVirtualMachines/jdk

    解决方案: 点击IDEA菜单里的Help-Edit Custom Properties,没有这个properties文件的话,会提示创建,在里面加上 idea.no.launcher=true 说明: ...

  7. 小程序UI设计（9）-文字排版

    小程序中一般很少大段落的文字,基本是4.5个字的主题.一行标题.一行摘要.两行描述.显示时超出部分用省略号代替.下面结合工具使用介绍一下文字排版的方法.先看效果图.  工具中属性设置如下图:两行文字属 ...

  8. C#学习之Timothy Liu

    原文出自 本文摘录了一些值得学习的地方. 1.对一个程序来说,静态指编辑期.编译期,动态指运行期. 静态时装在硬盘里,动态时装在内存里. 2.反射示例 通过反射获得类的属性和方法. static vo ...

  9. 201871010105-曹玉中《面向对象程序设计（java）》第十七周学习总结

    201871010105-曹玉中<面向对象程序设计(java)>第十七周学习总结 项目 内容 这个作业属于哪个过程 https://www.cnblogs.com/nwnu-daizh/ ...

  10. 将 对象序列化与反序化 (json格式)

    实体类 package com.nf.redisDemo1.entity; public class News { private long id; private String title; pri ...