- 当前 Bug 的表现(可附上截图)
在自定义组件 Component 的 properties 中定义 prop 的缺省值以及 observer 函数。
当使用该组件需要初始化该组件时,若 prop 接收外部传入的实参与该 prop 的默认值不相等时,会导致 observer 被立即调用一次。
- 预期表现
prop 的缺省值应该是组件未接收到外部传参时,使用的缺省值作为默认值,这属于组件初始化工作,不应该视为 prop 发生了变化。
所以当组件初始化时,如果 prop 接收的外部传参与缺省值不相等时,不触发 observer 调用是不是更合理一点?
- 提供一个最简复现 Demo
代码片段:wechatide://minicode/8SCwknmx7D3z
设计如此。这里的用意是,只要任何属性值与组件自身设定的初始值不同,observer 就一定会触发。
设计上的原因是,有时很难界定你在问题中所说的“初始化”阶段。组件的属性值可能因为父组件传参变化,而父组件的传参又可能因为它的父组件传参而发生变化,而且这种变化可能发生在任何时候,比如组件被插入到父节点的时候,可能发生的事情包括触发 attached 、触发 relation linked 等,而这些又可能会有连锁的反应。很难划线说哪个点之前算“初始化”。
目前这种设计的好处是,如果有其他 data 字段随着这个属性变化,可以轻易处理。之后我们也会继续沿着这个方向来扩展。
感谢你的回复,这种设计固然有它方便之处,但它的缺陷也很显而易见,组件没有动态设置初始值的能力。
假设考虑一下以下场景,某组件的 prop 属性 male 是一个 Boolean 类型,true 表示男,false 表示女,另外有一个 observer,需要观察 male 的变化:
true 变 false 时,播放一个由男变女的动画。
false 变 true 时,播放一个由女变男的动画。
假定 male 缺省值为 true,该组件应用在一个用户信息编辑页面,那所有女性用户进入该编辑的页面都会触发男变女动画,而所有男性用户进入编辑页面则没有任何动画。
该场景下,产品的设计需求应该是所有用户进入编辑页面时,不要播放任何动画,当用户进行性别选择后,才播放相应的动画。
诚然这只是我假设的一种应用场景,当然开发者也可以利用技巧规避错误播放动画。但通过这一场景,我想说明的重点是,不是所有组件的初始值都能够在定义组件时就被确定,开发者在 prop 中定义的 value 应是属性初始值的缺省值,当组件没有从外部接收到 prop 的初始值时,则使用开发者定义的缺省值作为初始值,否则以外部传入的值作为属性初始值。
这个设计确实有时不是很方便,这里只是追求一种相对的可控。因为在 WXML 属性层层传递和各种动态影响过程中,如果取父节点传递下来的值作为“初始值”,有时难以判定和控制初始值究竟是什么。
而且作为基础特性,多提供代码执行时机总是比少提供时机要好一些。
像你面对的这个问题,我能够想到的方法有两种:
进行动画判定的时候,检测组件的 attached 是不是已经触发,如果否,就不执行动画(这是一种很实用的方法,但其实不太符合自定义组件的设计哲学,即“数据应该反映组件的状态”);
属性有三个状态 “initial” “male” “female” ,“initial” 变为其他状态的时候,不触发动画。
以上示例是我推演出来的假设场景,之所以举例 Boolean 类型的 prop,是因为这种类型的属性最容易体现这种设计的风险。
组件是当前数据的表现层,但数据不仅仅是变量,更是一种矢量。
感谢你回复让我更好地了解你们的设计哲学,这对我是很有助益的。
OK!
。。。