React 学习笔记 0001

 

React 是什么?

解释不了

开发环境的搭建

安装 nodejs

https://www.php.cn/js-tutorial-414607.html

https://nodejs.org/en/

使用脚手架

create-react-app 就是官方推荐的脚手架

$ sudo npm install -g create-react-app 
$ create-react-app chaos 
$ cd chaos
$ npm staret

使用浏览器访问 http://localhost:3000 就可以了.

常见的命令

## 安装 redux
$ npm install redux --save 
##弹出配置文件,用以自定义配置 webpack
$ npm run eject

照着脚手架手敲

index.html

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
	</head>
	<body>
		<div id="root"></div>
	</body>
</html>

index.js

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App'
import * as serviceWorker from './serviceWorker';

ReaceDOM.render(<App />, document.getElementById("root"));

serviceWorker.unregister();

App.js

import React from 'react';
imporet { createStore } from 'redux';
import {counter, addOne} form ./index.redux.js'

const store = createStore(counter);

class Hone extends React.Component {
    constructor(props) {
        super(props);
        console.log("LOG", "props =", props);
    }
    
    render() {
        let store = this.props.store;
        let num = store.getState() ;
        return (
        <div>
        	<h1>你们号!</h1>
        	<div>盒盒盒盒</div>
        </div>
        );
    }
}

« EOF »

If you like TeXt, don’t forget to give me a star :star2:.