Нужно ли передавать все данные руля одновременно или они могут поступать из разных мест? - PullRequest
Новая
       9

Нужно ли передавать все данные руля одновременно или они могут поступать из разных мест?

0 голосов
/ 21 января 2019

Я пытаюсь упорядочить свой код и не могу понять, как (или если вообще) я могу кормить значения моих рулей из нескольких файлов.

В настоящее время я настраиваю веб-сайт, используяexpress и express-handlebars.header и navigation bar являются частичными, в то время как контент будет использовать тег {{{body}}}.Теперь при переходе на определенную страницу, пусть пока это будет '/', я в конечном итоге вызову: 

res.render('index', {
    title: "Home"
});

Здесь я передаю title на layout.hbs, который помещает index.hbs файл в тег {{{body}}}.title используется в частичном заголовке.Это все хорошо, и название, скорее всего, меняется в зависимости от того, что отображается для области содержимого {{{body}}}.Однако у меня также есть данные, которые всегда одинаковы, такие как пользовательские данные, которые находятся в моем navigation bar (имя пользователя и аватар вверху).Теперь мне всегда нужно было бы передавать имя пользователя и аватар для вызова res.render(..).Это нормально или я могу как-то разделить это?

Фактический res.render вызов выглядит следующим образом: 

router.get('/', catchAsync(async (req, res, next) => {  
    if(req.authenticated) {
        res.render('index', {
            title: "Home",
            authenticated: true,
            username: req.userdetails.username,
            userid: req.userdetails.id,
            avatarid: req.userdetails.avatar
        });
    }
    else {
        // Render index view
        res.render('index', { 
            title: "Home",
            authenticated: false
        });
    }
}));

Данные req.authenticated и req.userdetails поступают из промежуточного программного обеспечения, котороеЯ поместил перед своими маршрутами, чтобы я мог убедиться, что пользователь правильно аутентифицирован, прежде чем показывать важные данные (может быть, это не лучшее решение, но оно работает пока и не является темой этого вопроса).

Теперь вся установка использует layout.hbs, который выглядит следующим образом: 

<!DOCTYPE html>
<html lang="en">
    <head>
        <!-- General Settings -->
        <meta charset="utf-8">
        <title>Some Title</title>
        <meta name="description" content="Some Description.">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">

        <!-- Material Design Light -->
        <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:regular,bold,italic,thin,light,bolditalic,black,medium&amp;lang=en">
        <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
        <link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.blue_grey-deep_orange.min.css" />
        <link rel="stylesheet" href="/css/main.css">
    </head>
    <body>
        <div class="demo-layout mdl-layout mdl-js-layout mdl-layout--fixed-drawer mdl-layout--fixed-header">
            {{> header }}
            {{> navigation }}
            <!-- Content -->
            <main class="mdl-layout__content">
                {{{ body }}}
            </main>
        </div>
        <script defer src="https://code.getmdl.io/1.3.0/material.min.js"></script>
        <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
    </body>
</html>

Вызов res.render всегда будет проходить через этот layout.hbs, а {{> navigation}} требует, чтобы имя пользователя и аватар были переданы.Я хотел бы, чтобы эти данные пришли откуда-то еще.Потому что в противном случае я в конечном итоге передам 20 переменных в этот конкретный вызов рендеринга, просто потому, что мне нужно также передать все из панели навигации и заголовка.

Разве невозможно иметь другой файл javascript, который вызываетчто-то похожее на res.render, но предназначенное только для {{> навигации}} частичного?

В конце я хотел бы получить что-то вроде этого:

Страница содержимого получает только заголовок: 

router.get('/', catchAsync(async (req, res, next) => {  
    if(req.authenticated) {
        res.render('index', {
            title: "Home",
            authenticated: true
        });
    }
    else {
        // Render index view
        res.render('index', { 
            title: "Home",
            authenticated: false
        });
    }
}));

Хотя панель навигации откуда-то еще получает только имя пользователя: 

res.render('{{> navigation}}', {
    authenticated: true,
    username: req.userdetails.username,
    userid: req.userdetails.id,
    avatarid: req.userdetails.avatar
});

Или, может быть, частичное может извлекать данные из определенного контекста?

Спасибо за ваше время!

...