BUZ-区域配置信息

最新推荐文章于 2023-06-24 02:58:26 发布

BraveOS

最新推荐文章于 2023-06-24 02:58:26 发布

阅读量245

点赞数

分类专栏： BUZ

本文链接：https://blog.csdn.net/weixin_39682269/article/details/85078397

版权

BUZ 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

AreaConfig -- 区域配置信息

在路由跳转时，会根据地址碎片信息解析区域配置文件，若区域配置文件未发生改变，则不需要重新加载和初始化。

做过MVC项目的童鞋对区域都有所了解，在项目规划期间会根据业务、功能划分多个区域，例如：用户、产品、订单等等，各区域要尽可能的做到低耦合，互相独立存在。针对某一个特定区域我们可能会存在很多通用的配置，例如：数据字典、广播事件等等，这时我们就可以通过对该区域的配置文件进行相应的设置来实现整个区域的独立配置。

若想获取当前区域配置信息，使用App.router.areaConfig进行读取。

export default {

//当前区域自定义布局方案

layout: "DefaultLayout",

//自定义当前区域自定义地址

defaultPath: "index",

//自定义当前区域公共样式

styles: [demoCss],

onInit:()=>{

//配置文件初始化时触发

},

onLayoutShow: () => {

//模板加载完毕后执行，可以处理一些当前模块公共事件

},

onTeardown:()=>{

//区域配置文件卸载监听方法

}

//自定义属性...

}

执行逻辑

if (this.areaConfig !== areaConfig) {

this.trigger("before:initArea");

//卸载原有区域样式

Utils.removeStyle(this.areaConfig.styles);

//装载新区域样式

Utils.insertStyle(areaConfig.styles);

//执行区域自定义初始化方法，只触发一次

if (Utils.isFunction(areaConfig.init)) {

areaConfig.init();

}

this.trigger("after:initArea");

}

上面是Router中的执行逻辑，当地址栏解析完毕后，会优先去寻找区域配置文件，若配置文件改变或者首次加载，则会广播App.router中的before:initArea事件，然后移除原有的区域样式，接下来装在新的区域样式，最后执行广播App.router的after:initArea事件。

当前区域内跳转时，由于区域配置文件不会改变，则不会重复执行上述逻辑。

属性

参数名	作用	类型	默认值	备注
layout	布局方案名称	String	App.option.defaultLayout	详见应用池属性介绍
defaultPath	默认地址	String		由于区域已确定，该值是Controller/Action/...
styles	当前区域自定义公共样式	Array		由于框架采用动态卸载、装载样式，所以务必在区域配置文件中先 import导入样式，然后将样式作为参数写入styles数组中。详见下面例子

动态装载、卸载样式

import demoCss from "~/areas/Demo/resource/demo.less";

import demoCss1 from "~/areas/Demo/resource/demo.css";

export default {

styles: [demoCss,demoCss1]

}

当区域切换时，Router会自动根据styles数组去卸载原有样式，并装载新的样式文件。

由于本项目采用了style-loader/useable，所有样式都支持use装载和unuse卸载例如下面这个例子：

import demoCss from "~/areas/Demo/resource/demo.less";

import demoCss1 from "~/areas/Demo/resource/demo.css";

//卸载样式

demoCss.unuse();

//装载样式

demoCss1.use();

若直接import样式文件，不会在页面中生效，必须执行use方可生效。

公开方法

方法名	作用	参数	备注
onInit	初始化方法		初始化配置文件时触发，在不切换区域时，只会执行一次。
onTeardown	配置文件卸载方法		优先执行原配置文件卸载，后执行新配置文件`onInit`
onLayoutShow	布局方案渲染完毕		布局方案渲染完成后执行，若新旧配置文件中的布局方案一致时，不会触发该事件，只有布局方案发生改变时执行一次。