Jade模板之间怎么传参
本文介绍了Jade模板之间怎么传参的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
问 题
母版页 layout.jade
//- layout.jade
doctype html
html
head
meta(charset="utf-8")
block title
title 网站标题
body
include head
block content文章页 article.jade
//- article.jade
extends layout
block title
title 文章标题
block content
h1 文章标题
在生成article.html的时候怎么让页面的标题title生成 文章标题 - 网站标题 这种模式？
同时 文章标题 在 article.jade 中重复使用，在 article.jade 头部定义变量不起效，如何解决？
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>文章标题 - 网站标题</title>
</head>
<body>
<h1>文章标题</h1>
</body>
</html>解决方案
文章页 article.jade 继承了 layout.jade，只能在所有的block代码块定义mixins、blocks 和变量，
解决办法：使用block 的prepend方法
Template Inheritance
母版页 layout.jade
//- layout.jade
block pageSettings
doctype html
html
head
meta(charset="utf-8")
block title
-var siteName = '网站标题'
if(articleTitle)
title= `${siteName} - ${articleTitle}`
else
title= siteName
body
block head
include head
block content文章页 article.jade
//- article.jade
extends layout
block prepend title
- var articleTitle = '文章标题'
block content
h1 文章标题运行后的页面
如果要传值到head.jade中只需要在 article.jade 中加上
prepend head
- var headVal= '一些文字'通过layout.jade include 的 head.jade 中就可以
header= headVal
如果使用
//- pageSettings在 layout.jade 中
prepend pageSettings
- var page = 'page title'在head.jade, layout.jade, article.jade 中都可以使用
这篇关于Jade模板之间怎么传参的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
