npm 包 keystone-admin-routes 使用教程

AI 编程助手,豆包旗下的编程助手,提供智能补全、智能预测、智能问答等能力,节省开发时间,释放脑海中的创造力,支持 VSCode,点击体验 AI

简介

在前后端分离的开发模式下,管理后台常常是一个不可或缺的部分。使用 keystone.js 可以快速构建一个管理后台,而 keystone-admin-routes 则可以方便地扩展和定制后台的路由和页面。

本文将介绍 keystone-admin-routes 的安装及使用方法,以及使用场景和示例代码。

安装

使用 npm 安装 keystone-admin-routes:

--- ------- --------------------- ------

使用方法

在 keystone 配置文件中,引入 keystone-admin-routes 和需要的模块。然后可以通过 adminRoutes.add 方法添加路由及页面。

示例代码:

----- -------- - --------------------
----- ----------- - ---------------------------------

---------------
  ------- --- ---------
  ------ ------ --------
  -------- ------------------------------------
  ----- ------- -------
  ------- -------- ------------

  -------- ------ -------- --------------------
  -------- ------ --------- -------------------
---

------------------------- ------------ ------------- -------------

---------------------- ---------------------

-----------------

其中,

  • add 方法的第一个参数是 keystone 实例;
  • 第二个参数是路由名称,也是用来生成 URL 的一部分;
  • 第三个参数是路由路径;
  • 第四个参数是对应的页面的文件名,也就是存放在 views 目录下的文件名。

添加路由后,可以在管理后台的底部导航菜单中看到对应的链接,点击后显示该页面。

使用场景

keystone-admin-routes 主要用于扩展和定制管理后台的路由和页面。

例如,在一个博客系统中,需要在管理后台添加一个页面用来显示所有文章的阅读量。可以通过 keystone-admin-routes 添加一个路由和页面,然后在该页面中查询数据库并展示数据。

示例代码:

----- -------- - --------------------
----- ----------- - ---------------------------------

---------------
  ------- --- ------
  ------ ------ --------
  -------- ---------------------------------
  ----- ------- -------
  ------- -------- ------------

  -------- ------ -------- --------------------
  -------- ------ --------- -------------------
---

------------------------- ---------------- ----------------- -----------------

---------------------- ---------------------

-----------------

在 views/article-views.pug 中,编写显示阅读量的代码,例如:

------- ---------------

----- -------
  -- --- ------- -----
  -----
    -----
      --
        -- ------- -----
        -- ---- -----
    -----
      ---- ------- -- --------
        --
          --- -------------
          --- ------------------

然后在 routes/index.js 中添加路由:

----- -------- - --------------------

------- - -------------- - -------- ----- ---- -
  ----- ---- - --- ------------------ -----
  ----- ------ - -----------

  -------------- - ----------------

  --------------- -------- ------ -
    --------------------------------------------------- ----- --------- -
      --------------- - ---------
      ----------
    ---
  ---

  -----------------------------
--

以上代码会查询数据库中的所有文章,并将阅读量显示在管理后台的该页面中。

总结

keystone-admin-routes 是一个方便的 keystone.js 扩展,可以快速添加自定义的路由和页面。上文介绍了安装及使用方法,以及使用场景和示例代码。

希望本文对您有所帮助,谢谢阅读!

来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/60066eff4c49986ca68d8bfb


猜你喜欢

  • npm 包 miaw 使用教程

    miaw 是一款 npm 包,它提供了许多方便快捷的前端开发工具,包括表单校验、事件管理、动画效果等,可以帮助开发者快速搭建一个稳定高效的前端项目。 在本文中,我们将介绍 miaw 的具体使用方法,并...

    4 年前
  • npm 包 mib 使用教程

    什么是 mib? Mib 是一个用于解决前端浮点数计算精度问题的小工具库,它提供了精度计算、转换、比较等多种方法,可以帮助我们在前端开发中避免由于 JavaScript 在浮点数计算时出现的精度误差问...

    4 年前
  • npm 包 miband 使用教程

    在前端开发中,常常需要制作一些与硬件设备交互的应用程序。而在智能穿戴设备领域,小米的 Mi Band 系列已经成为了国内最为流行的智能手环之一。为了方便开发者与 Mi Band 手环进行交互,社区内出...

    4 年前
  • npm 包 mfbs 使用教程

    MFBS(移动优先的前端 UI 框架)是一个基于 Bootstrap 的前端 UI 框架,在移动场景下具有较好的适配性和用户体验,同时也支持桌面端。如果你正在开发一个前端项目,想要在移动端上具有更好的...

    4 年前
  • npm 包 migauth 使用教程

    前言 在前端开发中,我们经常需要与第三方服务进行交互,而这些服务一般都需要进行身份认证。为了方便开发者进行身份认证,npm 社区中有很多成熟的身份认证 npm 包,本篇文章将介绍其中一个 npm 包 ...

    4 年前
  • npm 包 mikeyamadeo 使用教程

    本文介绍了 mikeyamadeo 这个 npm 包的使用方法和实际应用案例。 什么是 mikeyamadeo? mikeyamadeo 是一个使用 node.js 开发的 npm 包,用于生成随...

    4 年前
  • npm 包 `mikeysee-build-helpers` 使用教程

    mikeysee-build-helpers 是一款常见的前端项目构建工具,它是一个针对前端构建过程的 Node.js 模块,提供了一系列实用的辅助方法并可自定义扩展使用,旨在使前端项目开发更加便捷高...

    4 年前
  • npm 包 mikeysee-helpers 使用教程

    npm 是一个 Javascript 包管理器,用于管理开发过程中的代码和依赖项。一个使用 npm 的前端工程师,可以更加方便地管理和组织自己的代码。mikeysee-helpers 是一个 npm ...

    4 年前
  • npm 包 mikeysee-react-tinymce-input 使用教程

    介绍 mikeysee-react-tinymce-input 是一个基于 React 和 TinyMCE 的输入框组件,可以让用户轻松地在 React 应用中使用 TinyMCE 编辑器。

    4 年前
  • npm包mikeysee-typescript-helpers使用教程

    介绍 mikeysee-typescript-helpers是一个针对TypeScript编写的辅助工具包,旨在提供更便捷的开发方式和更好的代码阅读体验。该工具包由Mike在github中开源,可自由...

    4 年前
  • npm 包 mikronode 使用教程

    #npm 包 mikronode 使用教程 ##前言 在前端开发中,经常会用到 Node.js 进行服务器端渲染以及其他一些操作,而 npm 包则是 Node.js 平台上最流行的包管理工具,也是 N...

    4 年前
  • npm 包 miblog 使用教程

    在前端开发中,我们经常会需要创建和维护自己的博客,在传统的博客系统中需要自己开发后台,并部署到远程,而使用 JavaScript 工具 miblog 可以方便快捷地搭建自己的博客网站。

    4 年前
  • npm 包 mibox 使用教程

    什么是 mibox? mibox 是一个基于 Vue.js 开发的 UI 组件库,它包含了大量常用的前端组件,如按钮、表单、弹窗、分页、菜单等。使用 mibox 可以快速搭建一个漂亮的前端页面,并提高...

    4 年前
  • npm 包 mfd 使用教程

    mfd(Multiple Forms Designer)是一个用于创建和管理多个表单的 npm 包。它是一种非常实用的前端工具,可以帮助开发者更快捷、更简单的创建出多个表单,并将其与后端集成。

    4 年前
  • npm 包 mfdc-email 使用教程

    在现代 Web 开发中,很多前端项目经常需要发送邮件来完成某些核心功能,比如注册、找回密码、通知等等。而通过 npm 包管理器,我们可以快速找到并集成一些可靠的、易用的邮件发送库,以完成这些任务。

    4 年前
  • npm 包 mfdc-repl 使用教程

    介绍 mfdc-repl 是一个 npm 包,它是一个基于 Node.js 的 REPL(Read-Eval-Print Loop)工具,可以非常方便地进行 JavaScript 代码的交互测试和调试...

    4 年前
  • npm 包 mfdc-router 使用教程

    前言 在前端技术中,路由管理是必不可少的一部分。mfdc-router 是一个基于 React 的路由管理工具,它具有精简的 API 接口和强大的灵活性,可以满足各种场景的路由管理需求。

    4 年前
  • NPM 包 MFE 使用教程

    在现代化的前端开发中,使用微前端技术越来越普遍。而 MFE(Micro Frontends)是一种微前端实现方案,它可以使得多个团队可以独立开发和部署自己的前端应用,并且可以组合成一个大型的前端应用。

    4 年前
  • npm包mff使用教程

    前言 随着前端技术的不断进步,npm 命令成为了前端开发必备的工具之一,因为它可以方便我们安装各种第三方库(如 jQuery 等)和 Node.js 模块。而 mff 是一款非常有用的 npm 包,它...

    4 年前
  • npm 包 mff-command-init 使用教程

    简介 mff-command-init 是一款基于 Node.js 的命令行工具,它能够帮助开发者快速创建基于 MFF 模板的项目,并且可自定义项目名称、作者等信息。

    4 年前

相关推荐

    暂无文章