同步

优质
小牛编辑
129浏览
2023-12-01

EasyReact 是允许环形连接的,环形的连接使得多个节点可以进行同步。下面介绍关于同步的操作。

syncWith

针对于两个节点的同步,syncWith可以快速的帮我们建立两个节点的同步连接:

EZRMutableNode<NSNumber *> *nodeA = [EZRMutableNode new];
EZRMutableNode<NSNumber *> *nodeB = [EZRMutableNode new];
id<EZRCancelable> cancelable = [nodeA syncWith:nodeB];      // <- cancelable 用于取消两个节点的同步
nodeA.value = @1;
nodeB.value;                                                // <- @1
nodeB.value = @2;
nodeA.value;                                                // <- @2
[cancelable cancel];
nodeA.value = @3;
nodeB.value;                                                // <- @2

除了两个节点的完全同步,我们还可以给同步加正逆变换:

EZRMutableNode<NSNumber *> *nodeA = [EZRMutableNode new];
EZRMutableNode<NSNumber *> *nodeB = [EZRMutableNode new];
id<EZRCancelable> cancelable = [nodeA syncWith:nodeB transform:^id _Nonnull(NSNumber * _Nonnull source) {
  return @(source.integerValue / 2);                        // nodeB 每次变的时候 nodeA 怎么变
} revert:^NSNumber * _Nonnull(NSNumber *  _Nonnull target) {
  return @(target.integerValue * 2);                        // nodeA 每次变的时候 nodeB 怎么变
}];
nodeA.value = @1;
nodeB.value;                                                // <- @2
nodeB.value = @4;
nodeA.value;                                                // <- @2

手动同步

有的时候我们可能还需要多个对象同步,例如 3 个对象想要同步,使用syncWith两次是可以的,但是会创建 4 条变换:

                nodeA
                 ↑ |
                 | ↓
      nodeC----→nodeB
        ↑         |
        └---------┘

创建 3 条变换是最理想的:

                nodeA
              ↗   |
            ╱     |
          ╱       |
        /         ↓
      nodeC←----nodeB

这时你需要手动来创建同步的几条边:

EZRMutableNode<NSNumber *> *nodeA = [EZRMutableNode new];
EZRMutableNode<NSNumber *> *nodeB = [EZRMutableNode new];
EZRMutableNode<NSNumber *> *nodeC = [EZRMutableNode new];
[nodeB linkTo:nodeA];
[nodeC linkTo:nodeB];
[nodeA linkTo:nodeC];
nodeA.value = @1;
nodeB.value;                                                // <- @1
nodeC.value;                                                // <- @1
nodeB.value = @2;
nodeC.value;                                                // <- @2
nodeA.value;                                                // <- @2
nodeC.value = @3;
nodeA.value;                                                // <- @3
nodeB.value;                                                // <- @3

但是不要忘记手动断开连接,否则会导致节点无法释放。