目前碰到一个非常棘手的问题,当前项目采用的是vue+elemenuUI,有这样一个业务场景:
页面中有三个视图:
1,一个tree组件(采用的elementui的tree)
[{
Id,
Name,
status,
Type
Children:
[{
Id,
Name,
GIS, // 地图坐标 [lng,lat]
status, // 三种状态(未选,半选,全选)
Type,
}]
}]
2,一个百度地图
[{
Id,
Name,
GIS, // 地图坐标 [lng,lat]
status, // 三种状态(未选,半选,全选)
Type
}]
3,一个可以分类的列表(采用的elementui的tabs跟table组件)
[{
Id,
Name,
status, // 两种状态
Type
}]
数据源一次性从后台拉过来之后.三个视图的数据全部同步显示.默认都是未勾选状态.
要实现的功能就是三种视图的状态同步。
他们都有选中,未选中状态,(地图还有半选中状态),为什么会有半选中状态..因为我们的业务场景是这样:
一个设备下绑定了很多个设备
拉回来的数据可能是这样的:
[
{
id: 1,
name: "分类一",
children: [
{