小程式自定義元件的使用

極客蝸牛發表於2019-04-13
元件

使用小程式的自定義元件 類似於 vue的元件開發

  • 新建目錄→新建元件

    編輯器會自動生成 元件的 wxml wxss js json 檔案

    其中JS 檔案中的結構和頁面的不同

    元件 json 檔案中 需要開啟元件的開關 告訴程式這是元件

{ "component": true}
複製程式碼
  • 頁面（引入元件的頁面）json 中新增元件配置
{

    "usingComponents": { "component-tag-name": "path/to/the/custom/component" }

}
複製程式碼
  • 在頁面wxml檔案中使用元件
<component-tag-name></component-tag-name>
複製程式碼

元件的 生命週期

  • created 元件例項化，但節點樹還未匯入，因此這時不能用setData

  • attached 節點樹完成，可以用setData渲染節點，但無法操作節點

  • ready 元件佈局完成，這時可以獲取節點資訊，也可以操作節點

  • moved 元件例項被移動到樹的另一個位置

  • detached 元件例項從節點樹中移除

相關文章