Pug(前身为Jade)中的多行变量

6

这个可以使用吗?例如在这里:

- var movieList = [{title: "Ocean's Eleven", rating: 9.2}, {title: "Pirates of the Caribbean", rating: 9.7}];

mixin movie-card(movie)
  h2.movie-title= movie.title
  div.rating
    p= movie.rating

for movie in movieList
  +movie-card(movie)

我不想在每一行开头使用-。如果不可能,也许有一种方法可以导入多行JSON文件吗?


1
很遗憾,除非有人提出拉取请求(pull request),否则这个功能不会被实现:https://github.com/pugjs/pug/issues/796 - YakovL
2个回答

7

2
编译期间,您可以使用LOCALS(Jade)或DATA(Pug)导入JSON数据。这是我通过gulpjs和Pug执行的方式,movieList将是在gulpfile.js中创建的数据,songs.json将是一个外部文件。从您的代码示例中不清楚您是使用任务管理器还是express等...

gulpfile.js

var fs = require('fs'),
    gulp = require('gulp'),
    pug = require('gulp-pug'),
    movieList = [{title: "Ocean's Eleven", rating: 9.2}, {title: "Pirates of the Caribbean", rating: 9.7}];

gulp.task('markup', function() {
  gulp.src('./markup/*.pug')
    .pipe(pug({
      data: {
      // in Jade, this would be "locals: {"
        "movies": movieList,
        "music": JSON.parse( fs.readFileSync('./songs.json', { encoding: 'utf8' }) )
      }
    )
    .pipe(gulp.dest('../'))
  });
});

在Pug模板中
- var movieList = locals['movies'] // assuming this will eventually be "= data['movies']"
- var musicList = locals['music'] // assuming this will eventually be "= data['music']"

mixin movie-card(movie)
  h2.movie-title= movie.title
  div.rating
    p= movie.rating

for movie in movieList
  +movie-card(movie)

mixin song-card(song)
  h2.song-title #{song.title}
  div.rating
    p #{song.rating}

for song in musicList
  +song-card(song)

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接