Как создать повторно используемые HTML-элементы в проекте Django?Html

Программисты Html
Ответить
Anonymous
 Как создать повторно используемые HTML-элементы в проекте Django?

Сообщение Anonymous »

Я новичок в Django и работаю над проектом, в котором повторно использую статические страницы и изменяю их, чтобы они соответствовали шаблонам Django. В рамках предыдущего проекта я создал несколько пользовательских элементов HTML, используя файлы JavaScript и customElements.define(), так как я не знаком с React.
Я понял, что шаблоны Django не могут изменять статические файлы JS, в которых находятся эти элементы, и, в частности, ссылки не могут быть изменены. Основной элемент, который я действительно хочу перенести в этот проект, — это панель навигации в верхней части экрана, которая имеет ссылку на домашнюю страницу и, в зависимости от того, вошел ли пользователь в систему или нет, будет либо отображать кнопки «вход» + «зарегистрироваться», либо значок уведомления и изображение профиля.
Я действительно не знаю, как лучше всего это сделать, я видел несколько предложений, в которых я превращаю элемент навигационной панели в тег шаблона, а некоторые другие: просто помещаю необработанный HTML-код в файл и включаю его в шаблоны.
Это текущий код, который у меня есть для моей навигационной панели:

Код: Выделить всё

/**
* The main navigation bar that should only present one time in each page
* of the website.
*/
class NavBar extends HTMLElement {
constructor() {
super();
}

connectedCallback() {

this.innerHTML = `



[url=./home.html]Games Forum[/url]

// this div should be shown when the user isn't logged in

Log In
Sign Up

// this div should be shown when the user IS logged in





`;

this.querySelector('#to-login').addEventListener('click', () => {
// this should somehow have the login page url
window.location.href = "login.html"
})

this.querySelector('#to-signup').addEventListener('click', () => {
// this should somehow have the page url, I hard coded this in the previous project
window.location.href = "register.html"
})
}
}

customElements.define("nav-bar", NavBar);
Как лучше всего это сделать? Стоит ли мне вообще заморачиваться над этим или переключиться на что-то другое?

Подробнее здесь: https://stackoverflow.com/questions/798 ... go-project
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Html»