|
2 年之前 | |
---|---|---|
.. | ||
development | 2 年之前 | |
directives | 2 年之前 | |
LICENSE | 2 年之前 | |
README.md | 2 年之前 | |
async-directive.d.ts | 2 年之前 | |
async-directive.d.ts.map | 2 年之前 | |
async-directive.js | 2 年之前 | |
async-directive.js.map | 2 年之前 | |
directive-helpers.d.ts | 2 年之前 | |
directive-helpers.d.ts.map | 2 年之前 | |
directive-helpers.js | 2 年之前 | |
directive-helpers.js.map | 2 年之前 | |
directive.d.ts | 2 年之前 | |
directive.d.ts.map | 2 年之前 | |
directive.js | 2 年之前 | |
directive.js.map | 2 年之前 | |
experimental-hydrate.d.ts | 2 年之前 | |
experimental-hydrate.d.ts.map | 2 年之前 | |
experimental-hydrate.js | 2 年之前 | |
experimental-hydrate.js.map | 2 年之前 | |
lit-html.d.ts | 2 年之前 | |
lit-html.d.ts.map | 2 年之前 | |
lit-html.js | 2 年之前 | |
lit-html.js.map | 2 年之前 | |
package.json | 2 年之前 | |
polyfill-support.d.ts | 2 年之前 | |
polyfill-support.d.ts.map | 2 年之前 | |
polyfill-support.js | 2 年之前 | |
polyfill-support.js.map | 2 年之前 | |
private-ssr-support.d.ts | 2 年之前 | |
private-ssr-support.d.ts.map | 2 年之前 | |
private-ssr-support.js | 2 年之前 | |
private-ssr-support.js.map | 2 年之前 | |
static.d.ts | 2 年之前 | |
static.d.ts.map | 2 年之前 | |
static.js | 2 年之前 | |
static.js.map | 2 年之前 |
Efficient, Expressive, Extensible HTML templates in JavaScript
lit-html is the template system that powers the Lit library for building fast web components. When using lit-html
to develop web components, most users should import lit-html via the lit
package rather than installing and importing from lit-html
directly.
This is a stable release of lit-html
2.0 (part of the Lit 2.0 release). If upgrading from previous versions of lit-html
, please note the minor breaking changes from lit-html 1.0 in the Upgrade Guide.
Full documentation is available at lit.dev.
lit-html
lets you write HTML templates in JavaScript with template literals.
lit-html templates are plain JavaScript and combine the familiarity of writing HTML with the power of JavaScript. lit-html takes care of efficiently rendering templates to DOM, including efficiently updating the DOM with new values.
import {html, render} from 'lit-html';
// This is a lit-html template function. It returns a lit-html template.
const helloTemplate = (name) => html`<div>Hello ${name}!</div>`;
// This renders <div>Hello Steve!</div> to the document body
render(helloTemplate('Steve'), document.body);
// This updates to <div>Hello Kevin!</div>, but only updates the ${name} part
render(helloTemplate('Kevin'), document.body);
lit-html
provides two main exports:
html
: A JavaScript template tag used to produce a TemplateResult
, which is a container for a template, and the values that should populate the template.render()
: A function that renders a TemplateResult
to a DOM container, such as an element or shadow root.$ npm install lit-html
Or use from lit
:
$ npm install lit
Please see CONTRIBUTING.md.