Ron I Ron I - 4 months ago 50
Jade Question

Jade/Pug: variable not showing in mixin

I am new to Jade/Pug, and when I don't put the code with a variable in a mixin it works correctly, but when I use a mixin nothing is showing for the variable. I was hoping someone could explain how I can use mixins in variables correctly.

//-works
.teacher-wrapper
.teacher-container
each student in students
.studentCardContainer.shadow90
.studentInfoContainer
.studentPhotoContainer
.studentPhoto
img(src="some_img.jpg")
.studentName= student //<------ works
.studentEmotionContainer
div text
div text


In this example I would like to use a mixin for each student, but the
= student
is not working. I tried
#{student}
as well, but it didn't work.

//- doesn't work
.teacher-container
each student in students
+studentCard

mixin studentCard
.studentCardContainer.shadow90
.studentInfoContainer
.studentPhotoContainer
.studentPhoto
img(src="some_img.jpg")
.studentName= student//<------ doesn't work ?
.studentEmotionContainer
div text
div text

Iso Iso
Answer

You need to set student as an argument to your mixin:

mixin studentCard(student)
  .studentCardContainer.shadow90
    .studentInfoContainer
      .studentPhotoContainer
        .studentPhoto
          img(src="some_img.jpg")
        .studentName= student
    .studentEmotionContainer
      div text
      div text

.teacher-container
  each student in students
    +studentCard(student)