Отображение оповещений в мопсе

Я использую connect-flash для отображения предупреждений об ошибках и успехах, однако я не могу скрыть сообщения и заставить их показывать только при вызове.

Вот что у меня так далеко:

layout.pug

doctype html
html
  head
    title= title
    meta(name='viewport' content='width=device-width, initial-scale=1')
    meta(charset='utf-8')

    link(rel='stylesheet' href='https://cdn.jsdelivr.net/npm/tailwindcss/dist/preflight.min.css')
    link(rel='stylesheet' href='/stylesheets/style.css')
    link(rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css')
    link(rel='stylesheet' href='https://cdn.jsdelivr.net/npm/tailwindcss/dist/utilities.min.css')
  body(class='antialiased min-h-screen')
    include navigation
    include error
    block content
    include footer

    script(src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js')
    script(src='/javascripts/site.js')

app.js

var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var session = require('express-session');
var bodyParser = require('body-parser');
var sassMiddleware = require('node-sass-middleware');
var nodemailer = require('nodemailer');
var flash = require('connect-flash');

var index = require('./routes/index');
var users = require('./routes/users');

var app = express();
var port = process.env.PORT || 3000;

// mongoose.set('debug', true); // Only set when debugging

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');

// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(sassMiddleware({
  src: path.join(__dirname, 'public'),
  dest: path.join(__dirname, 'public'),
  indentedSyntax: true, // true = .sass and false = .scss
  sourceMap: true
}));
app.use(express.static(path.join(__dirname, 'public')));

// expressSession
app.use(session({
  secret: 'secret',
  saveUninitialized: true,
  resave: true
}));

// Connect Flash
app.use(flash());

// Global Vars
app.use(function (req, res, next) {
  res.locals.success_msg = req.flash('success_msg');
  res.locals.error_msg = req.flash('error_msg');
  next();
});

app.use('/', index);
app.use('/users', users);

// catch 404 and forward to error handler
app.use(function(req, res, next) {
  var err = new Error('Not Found');
  err.status = 404;
  next(err);
});

// error handler
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

module.exports = app;

error.pug

-if(success_msg)
  section(class='flex items-center bg-green text-white text-sm font-bold px-4 py-3' role='alert')
    svg(class='fill-current w-4 h-4 mr-2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20')
      path(d='M12.432 0c1.34 0 2.01.912 2.01 1.957 0 1.305-1.164 2.512-2.679 2.512-1.269 0-2.009-.75-1.974-1.99C9.789 1.436 10.67 0 12.432 0zM8.309 20c-1.058 0-1.833-.652-1.093-3.524l1.214-5.092c.211-.814.246-1.141 0-1.141-.317 0-1.689.562-2.502 1.117l-.528-.88c2.572-2.186 5.531-3.467 6.801-3.467 1.057 0 1.233 1.273.705 3.23l-1.391 5.352c-.246.945-.141 1.271.106 1.271.317 0 1.357-.392 2.379-1.207l.6.814C12.098 19.02 9.365 20 8.309 20z')
    p success_msg

-if(error_msg)
  section(class='flex items-center bg-orange-light text-white text-sm font-bold px-4 py-3' role='alert')
    svg(class='fill-current w-4 h-4 mr-2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20')
      path(d='M12.432 0c1.34 0 2.01.912 2.01 1.957 0 1.305-1.164 2.512-2.679 2.512-1.269 0-2.009-.75-1.974-1.99C9.789 1.436 10.67 0 12.432 0zM8.309 20c-1.058 0-1.833-.652-1.093-3.524l1.214-5.092c.211-.814.246-1.141 0-1.141-.317 0-1.689.562-2.502 1.117l-.528-.88c2.572-2.186 5.531-3.467 6.801-3.467 1.057 0 1.233 1.273.705 3.23l-1.391 5.352c-.246.945-.141 1.271.106 1.271.317 0 1.357-.392 2.379-1.207l.6.814C12.098 19.02 9.365 20 8.309 20z')
    p error_msg

Я также не совсем уверен, что правильно отображаю сообщение, так что помощь в этом также была бы полезна.

у меня тоже есть

req.flash('success_msg', 'Your email has been sent!');

По моему маршруту.

Вот что я вижу на странице загрузки

образ

0 ответов

Другие вопросы по тегам