实现事件绑定后，如果在事件中修改了某些变量，那么视图也应该相对应的发生改变，

在react 中，除了标签本身的所有内容都看作 props，所以只需要针对props进行更新即可。

更新props就是针对新旧两颗dom树进行遍历对比。

对比的规则实际上就是判断新旧dom树对应的节点tag是不是一样的，如果是一样的，则表示更新，如果不一样则表示删除、修改。

在对比之前需要考虑这样几个问题：

1. 如何获取新的dom树
2. 如何找到旧的节点
3. 如何进行diff props对比

如何获取新的dom树

在考虑如何获取新的dom树之前，可以想到dom树的获取是通过render函数拿到了根节点的vdom，然后赋值给 nextUnitOfFier 后启动 perfromFiberOfUnit 函数，然后根据相应的规则创建了链表。

同理，在更新的时候可以给nextUnitOfFier 重新赋值启动 perfromFiberOfUnit 函数，然后就可以获取新的dom树。

// 更新时可以调用update方法。
function update() {
    nextUnitOfFier = {
        dom: currentRoot.dom, 
        props: currentRoot.props,
        alternate: currentRoot, // 表示旧的节点。
    };

    root = nextUnitOfFier;
}

在update方法中，我们并不能像render函数一样给他传递el和container，所以可以先将el存储起来。

在commitRoot方法中通过commitWork递归拿到了最终的dom结构，所以可以在这里新建一个变量将root给存储起来，作为update中的el。

function commitRoot() {
    commitWork(root.child);
    currentRoot = root;  // 新建currentRoot变量存储root
    root = null;
}

至此，当调用update时，就可以重启perfromFiberOfUnit 并拿到新的dom树

如何找到旧的节点

新的dom树创建完成后，我们可以通过添加一个字段 alternate（备用）来表示旧的节点，以此来做一一对应关系，如下图所示：

如何在新旧dom树种建立起这种关系呢？