React介绍

2018-09-01 本文已影响0人金文三刀

React安装

安装Node.js(>=6), 安装npm(>=5.2)
npx create-react-app my-app
cd my-app
npm start

工程目录介绍

node_modules

public

favicon.ico
index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="theme-color" content="#000000">
    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
    <title>React App</title>
  </head>
  <body>
    <div id="root"></div>
  </body>
</html>

src

index.js 源代码入口文件

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';

ReactDOM.render(<App />, document.getElementById('root'));

App.js

import React, { Component } from 'react';

class App extends Component {
  render() {
    return (
      <div>hello world</div>
    );
  }
}

export default App;

.gitignore
package-lock.json
package.json
README.md

React中的关于组件的几个问题

import React, { Component } from 'react';中的{ Component }是什么意思?
没有用到React, 为何还要引用?

JSX语法的注意点

自定义组件在使用的时候要大写开头

上一篇下一篇

猜你喜欢

热点阅读