mirror of
https://github.com/harttle/liquidjs.git
synced 2026-09-20 15:00:42 -07:00
Deploying to gh-pages from @ harttle/liquidjs@70fdb7af48 🚀
This commit is contained in:
@@ -36,8 +36,8 @@
|
||||
|
||||
<link rel="stylesheet" href="../../css/navy.css">
|
||||
|
||||
<link rel="alternate" href="../../atom.xml" title="LiquidJS">
|
||||
</head>
|
||||
<link rel="alternate" href="../../atom.xml" title="LiquidJS" type="application/atom+xml">
|
||||
<meta name="generator" content="Hexo 5.4.0"></head>
|
||||
|
||||
<body>
|
||||
<div id="container">
|
||||
@@ -63,7 +63,7 @@
|
||||
|
||||
</select>
|
||||
</div>
|
||||
<a href="https://github.com/harttle/liquidjs" target="_blank" rel="noopener external nofollow noreferrer" id="github-link-wrap" class="main-nav-link"><i class="icon-github"></i>Github</a>
|
||||
<a target="_blank" rel="noopener external nofollow noreferrer" href="https://github.com/harttle/liquidjs" id="github-link-wrap" class="main-nav-link"><i class="icon-github"></i>Github</a>
|
||||
<a id="mobile-nav-toggle">
|
||||
<span class="mobile-nav-toggle-bar"></span>
|
||||
<span class="mobile-nav-toggle-bar"></span>
|
||||
@@ -87,24 +87,24 @@
|
||||
<header class="article-header">
|
||||
<h1 class="article-title" itemprop="name">引用和继承</h1>
|
||||
|
||||
<a href="https://github.com/harttle/liquidjs/edit/master/docs/source/zh-cn/tutorials/partials-and-layouts.md" target="_blank" rel="noopener external nofollow noreferrer" class="article-edit-link" title="改进这篇文档"><i class="icon-pencil"></i></a>
|
||||
<a target="_blank" rel="noopener external nofollow noreferrer" href="https://github.com/harttle/liquidjs/edit/master/docs/source/zh-cn/tutorials/partials-and-layouts.md" class="article-edit-link" title="改进这篇文档"><i class="icon-pencil"></i></a>
|
||||
|
||||
</header>
|
||||
<div class="article-content" itemprop="articleBody">
|
||||
<h2 id="引用模板片段" class="article-heading"><a href="#引用模板片段" class="headerlink" title="引用模板片段"></a>引用模板片段<a class="article-anchor" href="#引用模板片段" aria-hidden="true"></a></h2><p>对于如下两个模板文件:</p>
|
||||
<figure class="highlight plain"><table><tr><td class="code"><pre><span class="line">// 文件:color.liquid</span><br><span class="line">color: '{{ color }}' shape: '{{ shape }}'</span><br><span class="line"></span><br><span class="line">// 文件:theme.liquid</span><br><span class="line">{% assign shape = 'circle' %}</span><br><span class="line">{% include 'color' %}</span><br><span class="line">{% include 'color' with 'red' %}</span><br><span class="line">{% include 'color', color: 'yellow', shape: 'square' %}</span><br></pre></td></tr></table></figure>
|
||||
<figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line">// 文件:color.liquid</span><br><span class="line">color: '{{ color }}' shape: '{{ shape }}'</span><br><span class="line"></span><br><span class="line">// 文件:theme.liquid</span><br><span class="line">{% assign shape = 'circle' %}</span><br><span class="line">{% include 'color' %}</span><br><span class="line">{% include 'color' with 'red' %}</span><br><span class="line">{% include 'color', color: 'yellow', shape: 'square' %}</span><br></pre></td></tr></table></figure>
|
||||
|
||||
<p>输出为:</p>
|
||||
<figure class="highlight plain"><table><tr><td class="code"><pre><span class="line">color: '' shape: 'circle'</span><br><span class="line">color: 'red' shape: 'circle'</span><br><span class="line">color: 'yellow' shape: 'square'</span><br></pre></td></tr></table></figure>
|
||||
<figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line">color: '' shape: 'circle'</span><br><span class="line">color: 'red' shape: 'circle'</span><br><span class="line">color: 'yellow' shape: 'square'</span><br></pre></td></tr></table></figure>
|
||||
|
||||
<blockquote class="note tip"><strong class="note-title">".liquid" 文件扩展名</strong><p>如果设置了 <code>extname: ".liquid"</code> 选项,就可以省略 <code>layout</code>, <code>render</code> 和 <code>include</code> 里面文件名的 “.liquid” 后缀。详情请参考 <a href="./options.html#extname">extname 选项</a>。</p>
|
||||
</blockquote>
|
||||
|
||||
<h2 id="布局模板(模板继承)" class="article-heading"><a href="#布局模板(模板继承)" class="headerlink" title="布局模板(模板继承)"></a>布局模板(模板继承)<a class="article-anchor" href="#布局模板(模板继承)" aria-hidden="true"></a></h2><p>对于如下两个模板文件:</p>
|
||||
<figure class="highlight plain"><table><tr><td class="code"><pre><span class="line">// 文件:default-layout.liquid</span><br><span class="line">Header</span><br><span class="line">{% block content %}My default content{% endblock %}</span><br><span class="line">Footer</span><br><span class="line"></span><br><span class="line">// 文件:page.liquid</span><br><span class="line">{% layout "default-layout" %}</span><br><span class="line">{% block content %}My page content{% endblock %}</span><br></pre></td></tr></table></figure>
|
||||
<figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line">// 文件:default-layout.liquid</span><br><span class="line">Header</span><br><span class="line">{% block content %}My default content{% endblock %}</span><br><span class="line">Footer</span><br><span class="line"></span><br><span class="line">// 文件:page.liquid</span><br><span class="line">{% layout "default-layout" %}</span><br><span class="line">{% block content %}My page content{% endblock %}</span><br></pre></td></tr></table></figure>
|
||||
|
||||
<p>渲染 <code>page.liquid</code> 将会输出:</p>
|
||||
<figure class="highlight plain"><table><tr><td class="code"><pre><span class="line">Header</span><br><span class="line">My page content</span><br><span class="line">Footer</span><br></pre></td></tr></table></figure>
|
||||
<figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line">Header</span><br><span class="line">My page content</span><br><span class="line">Footer</span><br></pre></td></tr></table></figure>
|
||||
|
||||
<blockquote class="note tip"><strong class="note-title">Block</strong><ul>
|
||||
<li>布局文件(父模板)中可以定义多个 block;</li>
|
||||
@@ -113,7 +113,7 @@
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2021-09-26T12:45:03.359Z" itemprop="dateModified">上次更新:2021-09-26</time>
|
||||
<time class="article-footer-updated" datetime="2021-09-30T16:54:19.718Z" itemprop="dateModified">上次更新:2021-09-30</time>
|
||||
<a href="render-file.html" class="article-footer-prev" title="文件渲染"><i class="icon-chevron-left"></i><span>上一页</span></a><a href="use-in-expressjs.html" class="article-footer-next" title="Express.js 中使用"><span>下一页</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
@@ -122,7 +122,7 @@
|
||||
<div id="article-toc-inner">
|
||||
<div id="article-toc-inner-list">
|
||||
<strong class="sidebar-title">目录</strong>
|
||||
<ol class="toc"><li class="toc-item toc-level-2"><a class="toc-link" href="#引用模板片段"><span class="toc-text">引用模板片段</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#布局模板(模板继承)"><span class="toc-text">布局模板(模板继承)</span></a></li></ol>
|
||||
<ol class="toc"><li class="toc-item toc-level-2"><a class="toc-link" href="#%E5%BC%95%E7%94%A8%E6%A8%A1%E6%9D%BF%E7%89%87%E6%AE%B5"><span class="toc-text">引用模板片段</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#%E5%B8%83%E5%B1%80%E6%A8%A1%E6%9D%BF%EF%BC%88%E6%A8%A1%E6%9D%BF%E7%BB%A7%E6%89%BF%EF%BC%89"><span class="toc-text">布局模板(模板继承)</span></a></li></ol>
|
||||
</div>
|
||||
<a href="#" id="article-toc-top">回到顶部</a>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user