**封裝分為多種寫法,不同寫法作用不同,本章節主要介紹封裝的不同寫法以及作用。**
<br/>
封裝的主要寫法如下(**其他內部封裝見【內置封裝】章節**):
```
//此處以Page為例
import JBoot from 'jboot-env'; //引入框架
import 'jboot-env/dist/loading.css'; //引入loading樣式
export default JBoot .page({
//此處書寫業務邏輯即可。
});
```
如果通過【開始使用】章節中的` options.wrap`配置項進行了自定義封裝的配置,使用方式如下:
```
//此處以Page為例
import JBoot from 'jboot-env';
//此處假設已經配置了一個名為pageExtend的擴展封裝。
//通過$plugins: 'pageExtend' 或 $plugins: ['pageExtend']的方式,即可使用該自定義封裝,名稱要與配置時的名稱保持一致!
export default JBoot.page({
$plugins: 'pageExtend',
//此處書寫業務邏輯即可。
});
//如果需要引入多個自定義封裝,寫法為:
export default Page.build({
$plugins: ['pageExtend', 'pageExtend1', ....],
//此處書寫業務邏輯即可。
});
```
如果需要在該頁面引入store(**內置的store有user、menus、buttons、other,具體見【內置store】章節**),寫法如下:
<br/>
注:也可引入通過【開始使用】章節中通過`storeConfig.add(name, store)`配置的自定義store,只要此處引用時的名稱與配置時的名稱保持一致即可!
```
//此處以Page為例
import JBoot from 'jboot-env';
//此處示例為引入的user對象。
export default JBoot.page({
$stores: 'user',
//此處書寫業務邏輯即可。
methos: {
sayHi(){
//通過此方式即可使用。
alert(this.user.name);
}
}
});
//如果需要引入多個store對象,寫法為:
export default JBoot.page({
$stores: ['user', 'menus'],
//此處書寫業務邏輯即可。
});
```