带你读《2022技术人的百宝黑皮书》——我在淘宝做弹窗，2022 年初的回顾与展望（4）https://developer.aliyun.com/article/1340420?groupCode=taobaotech
行为模块的设计
行为模块描述弹窗对用户行为的响应，在数据结构的设计上，站在被响应物体的角度，描述了物体应响应什么，响应的目标以及响应的内容，具体字段设计如下：
type ：表示响应事件的类型，如点击（click ），Tab 切换（tabSwitch ）等； behavior ：表示弹窗的行为类别，经过我们长时间的归纳总结，可将弹窗行为分类为：
goto ：页面跳转；
switch ：弹窗内部状态切换； call ：端外环境唤端至端内； request ：发送请求；
close ：关闭弹窗；
doNothing ：什么也不做（默认）； show ：显示；
hide ；隐藏；
target ：表示弹窗行为对象，会根据 behavior 字段的不同而拥有不同语义，例如当 behavior 为 switch 时， target 表示待切换的状态 ID；
content ：表示弹窗行为的内容，例如当 behavior 值为 goto ，target 值为 app ，content 值为 https://ww w.taobao.com 时，表明事件发生时，页面需跳转至端内首页；
通过这样的数据结构设计，我们可以最大限度的清晰表达弹窗的行为，并通过基础字段的扩展和组合，在不改变数据结构的情况下灵活，高效地支持各式各样的新需求。
一般而言，弹窗针对用户行为仅会有一次响应。但随着我们对淘宝场景，用户行为感知能力的不断提示，在极少数场景下开始出现需要弹窗响应多个行为的需求。在权衡场景的稀有性和 DSL 的扩展性后，我们针对这种特殊场景开辟了 actions 字段，数据结构如下：
1 |
{ |
|
2 |
|
actions:[ |
3 |
|
{ |
4 |
|
"type": "click", |
5 |
|
"content": [ |
6 |
|
{ |
7 |
|
"id": "1", |
8 |
|
"target": "State_2", |
9 |
|
"behaivior": "switch", |
10 |
|
"content": "", |
11 |
|
"nextActions": ["2"], |
12 |
|
"fallbackActions": [] |
13 |
|
}, |
14 |
|
{ |
15 |
|
"id": "2", |
16 |
|
"target": "", |
17 |
|
"behaivior": "close", |
18 |
|
"content": "", |
19 |
|
"nextActions": [], |
20 |
|
"fallbackActions": [], |
21 |
|
} |
22 |
|
] |
23 |
|
} |
24 |
|
] |
25 |
} |
|
通过调整数据结构，复用 action 字段并同时扩展 nextActions 与 fallbackActions 字段，我们可以轻松实现一个树状的行为描述，最低成本的实现并行或串行行为的描述
带你读《2022技术人的百宝黑皮书》——我在淘宝做弹窗，2022 年初的回顾与展望（6）https://developer.aliyun.com/article/1340418?groupCode=taobaotech
