0%

React 源码浅析之 - onlyChildren

这个模块的代码非常简单,短短十几行。

1
2
3
4
5
6
7
8
9
10
11
12
var ReactElement = require("ReactElement");

var invariant = require("fbjs/lib/invariant");
function onlyChild(children) {
invariant(
ReactElement.isValidElement(children),
"React.Children.only expected to receive a single React element child."
);
return children;
}

module.exports = onlyChild;

就是判断传入的 children 是不是一个合法的 React 元素,否则就抛错出来。判断的逻辑就在 ReactElement 模块里面:

1
2
3
4
5
6
7
ReactElement.isValidElement = function (object) {
return (
typeof object === "object" &&
object !== null &&
object.$$typeof === REACT_ELEMENT_TYPE
);
};

总结

那么到这里为止,所有 React 本身提供的 API 和模块就算是看完了。但是光看 React 本身的这些代码,其实并不能解决什么问题,比如 React Component 的生命周期是怎么实现的, setState 是怎么运作的,以及是如何把 React Component 渲染到浏览器中的,还有很多问题。
有机会我会继续寻找这些答案。

相关文章

如果觉得此文章对你有帮助,可以请我喝咖啡O(∩_∩)O