处理业务逻辑时，如何对某几个值做联动性处理？

Question

问题描述

在业务开发中，经常会遇到某几个值是有联系的。

问题出现的环境背景及自己尝试过哪些方法

环境背景

举一个最简单的例子：国家-省份-城市 的3级联动下拉框(可能不是很恰当，或者您可以扩展想象一个您熟悉的联动?)。
再举一个复杂点的例子: A-B-C-D 三个值，X -> Y 表示X改变时,Y也会做出对应的改变。
A -> B, A -> C， B -> C, D -> A
在某一个值变动的时候，会触发其他值也跟着改变(可能还需要验证是否合法/不为空)。如果一个一个写方法去处理它们之间的联动关系或者进行验证太恶心了。

尝试

所以我在想可不可以在项目中(当前项目是用Vue做的，由于所依赖组件的使用方法的限制，this.list中的item无法使用computed)，使用Object.defineProperty来对某些值来做set()/get()方法的重写。
但是总感觉这么做会不会太"土"了。。。不够优雅，但是如果通过写methods来对这些值之间的业务关系来做处理更麻烦。。

你期待的结果是什么？实际看到的错误信息又是什么？

想请教一下大家对这种业务逻辑中有关联性(一个值改变导致其他值发生改变)的情况如何处理。

Answer 1

以省市区选择下拉框为例

声明4个业务逻辑单元（function or class）

1. 获取中国省份列表：getProvinces
2. 获取指定省份的城市列表：getCitys
3. 获取指定城市的区列表：getAreas
4. 清空区列表数据：clearAreas

定义2个事件：

1. 选择省份：select-province
2. 选择城市：select-city

省市区选择下拉框初始化时，执行逻辑单元getProvinces预先获取省份列表数据

select-province事件触发需执行的业务逻辑单元：

• getCitys
• clearAreas

select-city事件触发需执行的业务逻辑单元：

• getAreas

这样会麻烦吗？

Answer 2

watch监听某个值的变化，探后触发方法更新第二个第二个数据，watch第二个数据，更新第三个

Answer 3

你的描述我表示歧义 一个一个去处理是什么意思? 值变化触发别的值变化 a>a1>a2...
不就是一套代码的事情么? 按你说的三级联动 省变化 去触发 市的变化 市变化触发地区
ex:

input 省  @change 去触发获取市的请求|数据处理    赋值 input市
input 市  @change 去触发获取区的请求|数据处理    赋值 input区
input 区  ...

watch 同理
有什么复杂地方么? 何来一个一个的去处理