Yeşim şablonumda bir navbar ekleme

Question

Düğüm, ifade ve önyükleme kullanıyorum.

Bu oldukça genel bir soru gibi görünüyor, ancak tam olarak nerede aradığımı bulamıyorum. Bir layout.jade dosyası ve bir index.jade dosyası var ve dizimimi index.jade dosyasında kullanıyorum.

layout.jade

doctype html 
html 
    head 
    title= title 

    block styles 

     link(rel='stylesheet', href='/stylesheets/static/bootstrap.css') 

    body 

    block navBar 
     div.container 
      ul.col-md-12.row 
       a(href="#") 
        li.col-md-3.col-md-offset-1 Register 
       a(href="#") 
        li.col-md-3 Login 
       a(href="#") 
        li.col-md-3 About Chatbox 
    block content 

index.jade

extends layout 

block append styles 

    link(rel='stylesheet', href='/stylesheets/homePage/style.css') 

block navBar  

block content 

    div.box 
     h1.col-md-4.col-md-offset-4 Chatbox 

: Sorun benim gezinti çubuğu göstermek için alamıyorum, bir ... İşte benim kodudur

Buradaki şablonlar hakkında neyi anlamadım? Blok bölümünün altında olan her şeyin sayfaya ekleneceğini ve blok içeriğinin navBar'ın içinde bulunmadığından, navBar'ın altında olduğu gibi içeriğe ekleyebileceğimi varsaydım.

Görünen tek şey, index.jade dosyasında blok içeriğine koyduğum şeyler. Nasıl düzeltebilirim?

Answer 1

index.jade dosyanıza extends layout yazdığınızda layout.jade dosyasındaki her şeyin dahil edileceği anlamına gelir.

Kod, hangi dosyanın oluşturulmasına bağlı olarak kodu değiştirmek istediğinizde kullanılır. Bu durumda size layout.jade içinde block navBar içermelidir söylüyor:

div.container 
      ul.col-md-12.row 
       a(href="#") 
        li.col-md-3.col-md-offset-1 Register 
       a(href="#") 
        li.col-md-3 Login 
       a(href="#") 
        li.col-md-3 About Chatbox 

Sonra index.jade içinde tekrar block navBar tanımlanması ve layout.jade içinde tanımını üzerine yazıyorsunuz. Ve block navBar index.jade sayfanızda herhangi bir içerik barındırmıyorsa, hiçbir şey yapılmıyordur ve sadece block navBar beyannamesini index.jade sayfasından silin.

block navBar  
    //nothing here means you are telling it to be empty. 
block content 

Temelde bunu her yerde navbar kullanacağız biliyorsanız size hiç sürece sizin layout.jade içinde beyan olarak bunun için bir blok ihtiyaç ve extends layout kullanmayın anlamına gelir bütün senin diğer dosyalar. Sadece sayfadan sayfaya değişen kod için blokları kullanın.

Answer 2

tutorial'da "Componente Navbar" öğesine gidin. Bu ispanyolca, ama sadece kodu okumanız gerekiyor.