同步

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

syncWith

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

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

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

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

手动同步

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

  1.                 nodeA
  2.                  ↑ |
  3.                  | ↓
  4.       nodeC----→nodeB
  5.         ↑         |
  6.         └---------┘

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

  1.                 nodeA
  2.               ↗   |
  3.             ╱     |
  4.           ╱       |
  5.         /         ↓
  6.       nodeC←----nodeB

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

  1. EZRMutableNode<NSNumber *> *nodeA = [EZRMutableNode new];
  2. EZRMutableNode<NSNumber *> *nodeB = [EZRMutableNode new];
  3. EZRMutableNode<NSNumber *> *nodeC = [EZRMutableNode new];
  4. [nodeB linkTo:nodeA];
  5. [nodeC linkTo:nodeB];
  6. [nodeA linkTo:nodeC];
  7. nodeA.value = @1;
  8. nodeB.value;                                                // <- @1
  9. nodeC.value;                                                // <- @1
  10. nodeB.value = @2;
  11. nodeC.value;                                                // <- @2
  12. nodeA.value;                                                // <- @2
  13. nodeC.value = @3;
  14. nodeA.value;                                                // <- @3
  15. nodeB.value;                                                // <- @3

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