組件化的項目開發中，組件應當划分為三個層次：組件、模塊、頁面
微信小程序已經為開發者封裝好了基礎組件，頁面文件（pages）也有了詳細的規定
而模塊就需要自行開發，並且要和頁面文件區分開，這就涉及到自定義組件
一、基本用法
在根目錄下創建一個 components 目錄，用於存放自定義組件
組件也是由 json、wxml、wxss、js 四個文件組成
其中 wxml 部分沒有什么特殊的地方，和頁面的寫法一致
wxss 也是只對組件生效，而且 app.wxss 中的樣式也不會對自定義組件生效
最關鍵的地方在於，需要在 json 中添加配置項：
將 component 字段設為 true，這樣才能注冊這個自定義組件
當需要在頁面中使用自定義組件的時候，在頁面的 json 文件中添加聲明：
{ "usingComponents": { "組件名": "組件路徑" } }
然后就能在頁面的 wxml 中直接使用該組件
二、參數傳遞 組件與組件之間的參數傳遞比較復雜，留到下一篇博客中細說，這里只介紹 properties
小程序的頁面 pages 需要使用 Page() 來注冊，而組件則需要 Component() 構造器
如果組件需要接受一個外部數據，比如一個列表組件的數據源 data，可以這么配置：
這里的 properties 類似於 vue 中的 props，表示該對象下的屬性將從外部傳入
properties 可設置 type、value、observer 三個屬性
其中 type 用於指定字段類型（ Number，String，Array，Object，Function）
value 表示字段的默認值，observer 用於定義該字段的監聽函數
在頁面上調用組件的時候，直接給 data 賦值就好：
PS：開發中應當避免使用 data 為前綴的屬性名（如 data-info），這會被識別為 dataset 中的參數
三、組件插槽
小程序的組件也可以使用 <slot> 來擴展內容
然后父組件引入這個組件的時候，可以在組件中插入節點，節點內容會渲染到 <slot> 節點的位置
組件默認只能有一個 <slot>，如果需要添加多個插槽，首先需要在組件 js 中聲明
Component({ options: { multipleSlots: true // 在組件定義時的選項中啟用多slot支持 }, properties: { /* ... */ }, methods: { /* ... */ } })
然后需要給 <slot> 命名，以 name 來區分各個插槽
並在引用組件的時候，給節點指定對應的 <slot>
四、Behaviors
在 Vue 的項目中，可以采用 mixin 來引入一些公共方法或參數，小程序的 behaviors 和 mixin 十分相似
每個 behavior 通常是一個單獨的 js 文件，由 Behavior() 構造器創建，和 Components() 組件構造器類似，可以包含一組屬性、數據、生命周期函數和方法
// components/behaviors/wise.js module.exports = Behavior({ behaviors: [], // 可以引用別的 behaviors properties: { subName: { type: String } }, data: { subInfo: 'so cool you are' }, attached: function () {}, methods: { handleSubmit: function () { console.log('submit') } } })
使用的時候，在組件中引入，然后聲明該 behaviors
然后就能直接在組件中使用 behaviors 中定義的數據了
