範本總覽

待辦事項

如果時間允許,請按照大綱新增關於使用輸入的新頁面。

Lit 範本是使用 JavaScript 樣板字面值,並以 html 標籤標記所寫成的。字面值內容主要是一般的宣告式 HTML

範本語法看起來可能像是您只是在做字串插值。但是對於標記樣板字面值,瀏覽器會將一個字串陣列 (範本的靜態部分) 和一個表達式陣列 (動態部分) 傳遞給標籤函式。Lit 使用此方法來建構範本的有效表示,以便它可以僅重新渲染範本中已變更的部分。

Lit 範本極具表現力,可讓您以多種方式渲染動態內容

  • 表達式:範本可以包含稱為表達式的動態值,可用於渲染屬性、文字、屬性、事件處理程序,甚至是其他範本。
  • 條件式:表達式可以使用標準 JavaScript 流程控制來渲染條件式內容。
  • 清單:使用標準 JavaScript 迴圈和陣列技術,將資料轉換為範本陣列來渲染清單。
  • 內建指令:指令是可以擴充 Lit 範本功能的函式。該函式庫包含一組內建指令,可協助處理各種渲染需求。
  • 自訂指令:您也可以撰寫自己的指令,以根據需要自訂 Lit 的渲染方式。

您也可以在 Lit 元件之外,使用 Lit 的範本函式庫進行獨立範本。如需詳細資訊,請參閱獨立 lit-html 範本