Fix an example in the docs index page. (#8)

This commit is contained in:
Russell Bicknell
2019-12-20 16:58:32 -08:00
committed by GitHub
parent 3cc8adf0b1
commit 0fdd9a757a
2 changed files with 5 additions and 3 deletions

View File

@@ -58,7 +58,7 @@ import {html, render} from 'lit-html';
const name="lit-html";
render(html`
<h2>This is a my-element>h2>
<h2>This is a &lt;my-element&gt;</h2>
<my-element .name=${name}></my-element>
`, document.body);
```
@@ -66,6 +66,7 @@ render(html`
</div>
<div>
<h2>This is a &lt;my-element&gt;</h2>
<my-element name="lit-html"></my-element>
</div>

View File

@@ -52,10 +52,11 @@
<section class="columns">
<div>
<p><code>&lt;my-element&gt;</code> can be used with declarative rendering libraries like Angular, React, Vue, and lit-html</p>
<pre class="language-js"><code class="language-js"><span class="highlight-line"><span class="token keyword">import</span> <span class="token punctuation">{</span>html<span class="token punctuation">,</span> render<span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'lit-html'</span><span class="token punctuation">;</span></span><br><span class="highlight-line"></span><br><span class="highlight-line"><span class="token keyword">const</span> name<span class="token operator">=</span><span class="token string">"lit-html"</span><span class="token punctuation">;</span></span><br><span class="highlight-line"></span><br><span class="token function">render</span><span class="token punctuation">(</span>html<span class="token template-string"><span class="token template-punctuation string">`</span><span class="token string"><br><span class="highlight-line"> &lt;h2>This is a my-element>h2></span><br><span class="highlight-line"> &lt;my-element .name=</span><span class="token interpolation"><span class="token interpolation-punctuation punctuation">${</span>name<span class="token interpolation-punctuation punctuation">}</span></span><span class="token string">>&lt;/my-element></span><br></span><span class="token template-punctuation string">`</span></span><span class="token punctuation">,</span> document<span class="token punctuation">.</span>body<span class="token punctuation">)</span><span class="token punctuation">;</span></code></pre>
<pre class="language-js"><code class="language-js"><span class="highlight-line"><span class="token keyword">import</span> <span class="token punctuation">{</span>html<span class="token punctuation">,</span> render<span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'lit-html'</span><span class="token punctuation">;</span></span><br><span class="highlight-line"></span><br><span class="highlight-line"><span class="token keyword">const</span> name<span class="token operator">=</span><span class="token string">"lit-html"</span><span class="token punctuation">;</span></span><br><span class="highlight-line"></span><br><span class="token function">render</span><span class="token punctuation">(</span>html<span class="token template-string"><span class="token template-punctuation string">`</span><span class="token string"><br><span class="highlight-line"> &lt;h2>This is a &amp;lt;my-element&amp;gt;&lt;/h2></span><br><span class="highlight-line"> &lt;my-element .name=</span><span class="token interpolation"><span class="token interpolation-punctuation punctuation">${</span>name<span class="token interpolation-punctuation punctuation">}</span></span><span class="token string">>&lt;/my-element></span><br></span><span class="token template-punctuation string">`</span></span><span class="token punctuation">,</span> document<span class="token punctuation">.</span>body<span class="token punctuation">)</span><span class="token punctuation">;</span></code></pre>
</div>
<div>
<p><my-element name="lit-html"></my-element></p>
<h2>This is a &lt;my-element&gt;</h2>
<my-element name="lit-html"></my-element>
</div>
</section>