【React】

React(也被称为React.js或ReactJS)是一个用于构建用户界面的JavaScript库。它由Facebook和一个由个人开发者和公司组成的社区来维护。

React可以作为开发单页或移动应用的基础。然而,React只关注向DOM渲染数据,因此创建React应用通常需要使用额外的库来进行状态管理和路由,Redux和React Router分别是这类库的例子。

基本用法

下面是一个简单的React在HTML中使用JSX和JavaScript的例子。

function Greeter(props){

return

{props.greeting}

;

}

var App=;

ReactDOM.render(App,document.getElementById(“myReactApp”));

Greeter函数是一个React组件,它接受一个属性问候语。变量App是Greeter组件的一个实例,其中问候语属性被设置为”Hello World!”。然后,ReactDOM.render方法将我们的Greeter组件渲染在DOM元素(id为myReactApp)中。

在web浏览器中显示时,结果将是:

HelloWorld!

显著特点

组件化

React代码由称为组件的实体组成。组件可以使用React DOM库渲染到DOM中的一个特定元素。当渲染一个组件时,可以传入被称为”props “的值。

ReactDOM.render(,document.getElementById(‘myReactApp’));

React中声明组件的两种主要方式是通过功能函数组件和基于类的组件。

功能函数组件

功能组件是用一个函数声明,用来返回一些JSX。

const Greeting=(props)=> Hello,{props.name}!;

类组件

基于类的组件是使用ES6类来声明的。它们也被称为”有状态”组件,因为它们的状态可以在整个组件中保持,并且可以通过props传递给子组件。

class ParentComponent extends React.Component{

state={color: ‘green’};

render(){

return(

);

}

}