React 教程

React 是一個(gè)用于構(gòu)建用戶(hù)界面的 JAVASCRIPT 庫(kù)。
React主要用于構(gòu)建UI，很多人認(rèn)為 React 是 MVC 中的 V（視圖）。
React 起源于 Facebook 的內(nèi)部項(xiàng)目，用來(lái)架設(shè) Instagram 的網(wǎng)站，并于 2013 年 5 月開(kāi)源。
React 擁有較高的性能，代碼邏輯非常簡(jiǎn)單，越來(lái)越多的人已開(kāi)始關(guān)注和使用它。

React 特點(diǎn)

1.聲明式設(shè)計(jì) −React采用聲明范式，可以輕松描述應(yīng)用。
2.高效 −React通過(guò)對(duì)DOM的模擬，最大限度地減少與DOM的交互。
3.靈活 −React可以與已知的庫(kù)或框架很好地配合。
4.JSX − JSX 是 JavaScript 語(yǔ)法的擴(kuò)展。React 開(kāi)發(fā)不一定使用 JSX ，但我們建議使用它。
5.組件 − 通過(guò) React 構(gòu)建組件，使得代碼更加容易得到復(fù)用，能夠很好的應(yīng)用在大項(xiàng)目的開(kāi)發(fā)中。
6.單向響應(yīng)的數(shù)據(jù)流 − React 實(shí)現(xiàn)了單向響應(yīng)的數(shù)據(jù)流，從而減少了重復(fù)代碼，這也是它為什么比傳統(tǒng)數(shù)據(jù)綁定更簡(jiǎn)單。

1.通過(guò)父組件傳遞類(lèi)名給子組件的方法  （第十九行）

2.通過(guò)不同的狀態(tài)值，應(yīng)用某些類(lèi)名     （第22行）

 import React from 'react'import './style.css'class PageTitle extends React.Component {  constructor(props, context) {    super(props, context);    this.state = {      timeType:0    }  }  handleClick(timeType){    this.setState({      timeType:timeType    });    this.props.handle(timeType+1);  }  render() {    const {title,dataList} = this.props;    return (     <h3 className={this.props.clasName+" cp_title"}>{title}       <div className="floatR">         {dataList.map((item,index) => {           return <span key={index} onClick={this.handleClick.bind(this,index)} className={this.state.timeType === index ? "canvasNav canvasNavActive": "canvasNav"}>{item}</span>         })}       </div>     </h3>    )  }}export default PageTitle;

總結(jié)

以上所述是小編給大家介紹的React通過(guò)父組件傳遞類(lèi)名給子組件的實(shí)現(xiàn)方法，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)VeVb武林網(wǎng)網(wǎng)站的支持！