# Component
Component構造器可用于定義組件,調用Component構造器時可以指定組件的屬性、數據、方法等。
| 定義段 | 類型 | 是否必填 | 描述 |
| ---------- | ------------ | ---- | ---------------------------------------- |
| properties | Object Map | 否 | 組件的對外屬性,是屬性名到屬性設置的映射表,屬性設置中可包含三個字段, `type` 表示屬性類型、 `value` 表示屬性初始值、 `observer` 表示屬性值被更改時的響應函數 |
| data | Object | 否 | 組件的內部數據,和 `properties` 一同用于組件的模版渲染 |
| methods | Object | 否 | 組件的方法,包括事件響應函數和任意的自定義方法,關于事件響應函數的使用,參見 [組件事件](https://mp.weixin.qq.com/debug/wxadoc/dev/framework/custom-component/events.html) |
| behaviors | String Array | 否 | 類似于mixins和traits的組件間代碼復用機制,參見 [behaviors](https://mp.weixin.qq.com/debug/wxadoc/dev/framework/custom-component/behaviors.html) |
| created | Function | 否 | 組件生命周期函數,在組件實例進入頁面節點樹時執行,注意此時不能調用 `setData` |
| attached | Function | 否 | 組件生命周期函數,在組件實例進入頁面節點樹時執行 |
| ready | Function | 否 | 組件生命周期函數,在組件布局完成后執行,此時可以獲取節點信息(使用 [SelectorQuery](https://mp.weixin.qq.com/debug/wxadoc/dev/api/wxml-nodes-info.html) ) |
| moved | Function | 否 | 組件生命周期函數,在組件實例被移動到節點樹另一個位置時執行 |
| detached | Function | 否 | 組件生命周期函數,在組件實例被從頁面節點樹移除時執行 |
| relations | Object | 否 | 組件間關系定義,參見 [組件間關系](https://mp.weixin.qq.com/debug/wxadoc/dev/framework/custom-component/relations.html) |
| options | Object Map | 否 | 一些組件選項,請參見文檔其他部分的說明 |
生成的組件實例可以在組件的方法、生命周期函數和屬性 `observer` 中通過 `this` 訪問。組件包含一些通用屬性和方法。
| 屬性名 | 類型 | 描述 |
| ------- | ------ | ------------------- |
| is | String | 組件的文件路徑 |
| id | String | 節點id |
| dataset | String | 節點dataset |
| data | Object | 組件數據,**包括內部數據和屬性值** |
| 方法名 | 參數 | 描述 |
| ------------------- | ---------------------------------------- | ---------------------------------------- |
| setData | Object `newData` | 設置data并執行視圖層渲染 |
| hasBehavior | Object `behavior` | 檢查組件是否具有 `behavior` (檢查時會遞歸檢查被直接或間接引入的所有behavior) |
| triggerEvent | String `name`, Object `detail`, Object `options` | 觸發事件,參見 [組件事件](https://mp.weixin.qq.com/debug/wxadoc/dev/framework/custom-component/events.html) |
| createSelectorQuery | | 創建一個 [SelectorQuery](https://mp.weixin.qq.com/debug/wxadoc/dev/api/wxml-nodes-info.html) 對象,選擇器選取范圍為這個組件實例內 |
| selectComponent | String `selector` | 使用選擇器選擇組件實例節點,返回匹配到的第一個組件實例對象 |
| selectAllComponents | String `selector` | 使用選擇器選擇組件實例節點,返回匹配到的全部組件實例對象組成的數組 |
| getRelationNodes | String `relationKey` | 獲取所有這個關系對應的所有關聯節點,參見 [組件間關系](https://mp.weixin.qq.com/debug/wxadoc/dev/framework/custom-component/relations.html) |
- 簡介
- 第一章 公眾號開發
- 使用微信JSSDK
- 接口權限配置
- 分享接口
- 隱藏按鈕項
- 微信支付
- 第二章 小程序開發
- 基礎知識
- 分包加載
- WXSS樣式表
- 配置
- app.json配置
- window
- tabBar
- page.json配置
- 邏輯層
- app.js
- 場景值
- page.js
- 初始化數據
- 生命周期函數
- 頁面相關事件處理函數
- 事件處理函數
- 頁面實例方法
- 路由
- 文件作用域
- 模塊化
- 視圖層
- 模板語法
- 列表渲染
- 條件渲染
- 模板
- 事件
- 引用
- WXS語法規范
- WXS數據類型
- WXS控制流程
- WXS基礎類庫
- 組件
- 視圖容器
- view
- scroll-view
- swiper
- movable-view
- cover-view
- 基礎組件
- icon
- text
- rich-text
- progress
- 表單組件
- button
- checkbox
- form
- input
- label
- picker
- picker-view
- radio
- slider
- switch
- textarea
- 導航組件
- navigator
- 媒體組件
- audio
- image
- video
- camera
- 地圖組件
- map
- 畫布組件
- canvas
- 開放能力
- web-view
- 自定義組件
- 組件模版和樣式
- Component
- 組件傳值
- 組件事件
- Behaviors
- 組件間關系
- 網絡請求
- wx.request
- 微信登錄
- 獲取 openid 和 unionid
- 獲取用戶信息
- 將 wx.request 封裝為 promise
- 上傳圖片接口封裝
- 數據存儲
- 存儲數據和讀取數據
- 獲取數據緩存信息
- 移除數據緩存
- 獲取用戶設置
- openSetting
- getSetting
- 第三章 小游戲開發
- 參考資料