怎么查看react源码-js教程

查看react源码的方法：1、进入react官网；2、下载packages文件到本地；3、打开index.js文件即可，该文件就是react源码的入口文件。我们还可以通过babel将react源码进行转换。

本教程操作环境：windows10系统、react16版，该方法适用于所有品牌电脑。

（学习视频分享：react视频教程）

具体方法如下：

一、进入官网

https://github.com/facebook/react

二、源码都在 packages 文件里

https://github.com/facebook/react/tree/master/packages

三、可以将文件下载到本地，这样看起来会方便点

四、然后进入 pageages/react/index.js 文件里，这个文件就是react源码的入口

五、这个网址可以将react代码展示为通过babel转换的代码

https://react.docschina.org/

举例：

import React, { Component } from "react";import ReactDOM from "react-dom";import "./index.css"; function FuncCmp(props) { return <div>name: {props.name}</div>;} class ClassCmp extends Component { render() {     return <div>name: {this.props.name}</div>; }} const jsx = ( <div>     <p>我是内容</p>     <FuncCmp name="我是function组件" />     <ClassCmp name="我是class组件" /> </div>); ReactDOM.render(jsx, document.getElementById("root"));

babel编译后：

function FuncCmp(props) { return React.createElement(     "div",     null,     "name: ",     props.name );} class ClassCmp extends React.Component { render() {    return React.createElement(         "div",         null,         "name: ",         this.props.name     ); }} let jsx = React.createElement( "div", null, " ", React.createElement( "div", { className: "border" }, "我是内容" ), " ", React.createElement(FuncCmp, { name: "我是function组件" }), " ", React.createElement(ClassCmp, { name: "我是class组件" }), " "); ReactDOM.render(jsx, document.getElementById('root'));

相关推荐：js教程

以上就是怎么查看react源码的知识。速戳>>知识兔学习精品课！