前言
在 web 应用中，消息提示是一个必要的功能，能够提升用户体验和交互性。但是，手动编写消息提示的功能是比较繁琐的，需要重复地写 HTML 和 CSS，而且每个页面都需要。这时候，我们可以使用 npm 包 express-messages。
express-messages 是一个 npm 包，用于在 Express web 应用中添加消息提示功能。它可以让我们轻松地向用户显示闪现消息 (flash message)，而无需编写重复的 HTML 或 CSS。
在本文中，我们将探讨 express-messages 包的使用，以及如何在 Express web 应用程序的各个部分中使用它。
安装
要使用 express-messages，您需要首先通过 npm 安装它。
npm install express-messages
安装完成后，我们就可以在我们的应用程序中使用它了。
使用
在 Express 应用程序中使用 express-messages 很简单。您只需要在需要闪现消息的路由中设置消息，然后在回到主页后，将消息传递给呈现消息的视图。我们来看一下如何做到这一点。
首先，在我们的路由中设置消息。这些消息可以是成功消息，错误消息或其他消息，具体取决于您的应用程序和需求。
app.post('/login', function(req, res) {
// 检查用户是否存在
// 如果存在，设置成功消息
// 如果不存在，设置错误消息
req.flash('successMsg', '登录成功');
req.flash('errorMsg', '用户名或密码不正确');
res.redirect('/');
});在上面的示例中，我们在登录路由中设置了两种消息：成功消息和错误消息。我们使用 req.flash() 方法来设置这些消息。successMsg 和 errorMsg 是消息的类型。在本例中，我们使用 'login' 路由返回到主页。回到主页后，我们可以在视图中呈现消息。
-- -------------------- ---- -------
---- -------- ---
-- -- ------------ - --
---- ------------ ---------------
--- ---------- --
------
-- - --
-- -- ---------- - --
---- ------------ --------------
--- -------- --
------
-- - --在视图中，我们使用类似的方式提取和显示消息。使用这种方法可以使所有消息都自动呈现到它们所属的位置。
参数
express-messages 方法具有两个参数：消息类型和消息值。
类型
消息类型用于确定消息的类型，例如成功消息，错误消息等。
req.flash('success', '登录成功');
req.flash('error', '用户名或密码不正确');可以使用以下类型：
- success: 成功消息
- error: 错误消息
- warning: 警告消息
- info: 信息消息
值
消息值是在消息类型中设置的实际消息内容。可以是字符串、HTML 或 JS 对象。
req.flash('success', '登录成功');
req.flash('success', '<strong>登录成功</strong>');
req.flash('success', { icon: 'fa fa-check', message: '登录成功' });示例代码
index.js
-- -------------------- ---- ------- ----- ------- - ------------------ ----- ------- - -------------------------- ----- ----- - --------------------------- ----- --- - --------- ----- ---- - ---- ----------------- ------- --------- ------- ------ ------------------ ------ ------- - ------- ----- - --- ---------------- ------------ ----- ---- -- - ------------------- - ----------- ------------------------ --------- --------------------- -- -- ------------------ -------- ----- ---- - -- -------- -- ----------- -- ------------ ----------------------- -------- --------------------- ------------- ------------------ --- ---------------- -- -- - -------------------- --- --------- -- -------------------------- --
index.ejs
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
-------------- -------- ------------
-------
------
-- -- ------------ - --
---- ------------ ---------------
--- ---------- --
------
-- - --
-- -- ---------- - --
---- ------------ --------------
--- -------- --
------
-- - --
----- ------------- ----------------
-----
------ ---------------------------
------ ----------- ----------------
------
-----
------ --------------------------
------ --------------- ----------------
------
------- -------------------------
-------
-------
-------总结
以上是使用 express-messages 包添加消息提示功能的简单教程。通过将 messages 添加到路由中，我们可以轻松地向用户显示闪现消息，而无需编写重复的 HTML 或 CSS。并且，它还支持多种类型和消息值，可以提供灵活的消息呈现方式。希望这篇文章对你有所帮助！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/77926