React17.0

原文

更改事件委托

不再将事件委托到document, 而是委托到react渲染的根节点, 方便升级，存在多个react版本时也不会发生冲突，不会影响老代码，比如jquery, 在老项目中引入react，e.stopPropagation并不能阻止冒泡到jquery，新版本就可以避免这种情况。

根容器外的Portal，react也监听了Portal容器事件，所以不用担心Portal会有问题

其他

主要是一些要与浏览器统一

1. scroll事件

在浏览器中onScroll是不会冒泡的(父节点拿不到子节点冒泡的滚动事件)，但是可以捕获，但是react的实现却是默认冒泡可以传给父节点，在17版本中将会和浏览器统一， 相关issue

2. onFocus和onBlur将由focusin和focusout代替

浏览器不支持冒泡的比如 scroll、focus、blur 在react中的表现都是支持，所以对以前 focus 并没有影响

3. 捕获阶段事件（例如onClickCapture）现在使用真实的浏览器捕获阶段侦听器

没有事件池

以往我们不能异步使用 e.target.value，因为react重用了事件池，异步拿不到以前的东西

setState(data => ({
	// 在16版本这样会报错，只能使用 e.persist
	text: e.target.value
}))

17版本可以随便用了。

Effect Cleanup

useEffect(
	() => {
    	// effect 是异步执行的
        return () => {
        	// cleanup在react16中是同步执行的，在17中更改为异步执行
        }
    }
)

潜在问题

useEffect(() => {
	const instance = someRef.current
    someRef.current.someSetupMethod();
    return () => {
      // 由于异步，current可能会变成null
      someRef.current.someCleanupMethod();
      // 改成下面
      instance.someCleanupMethod();
    };
});

未定义的错误

react组件不返回值是会报错的，但是forwardRef和memo不会处理，现在添加上了.

更好的组件报错机制

删除了一些私有导出

安装

npm install react@17.0.0-rc.0 react-dom@17.0.0-rc.0