第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

import?React,{?Component?}?from?'react';class?TodoList?extends?Component{handlerClick(){this.setState({list:[...this.state.list,this.state.inputvalue],inputvalue:''})//this.state.list.push('1');}handleInput(e){this.setState({inputvalue:e.target.value});}//構(gòu)造器constructor(props){super(props);this.state={list:['learn?react','learn?english','learn?vue'],inputvalue:''}}render(){return(<div><div><input?value={this.state.inputvalue}?onChange={this.handleInput.bind(this)}/><button?onClick={this.handlerClick.bind(this)}>add</button></div><ul>{this.state.list.map((item,index)=>{return?<li?key={index}>{item}</li>})}</ul></div>);}}export?default?TodoList;

import React,{ Component } from 'react';

class TodoList extends Component{

handlerClick(){

this.setState({

list:[...this.state.list,'1']

})

//this.state.list.push('1');

}

//構(gòu)造器

constructor(props){

super(props);

this.state={

list:[

'learn react',

'learn english',

'learn vue'

]

}

}

render(){

return(

<div>

<div>

<input/>

<button onClick={this.handlerClick.bind(this)}>add</button>

</div>

<ul>

{

this.state.list.map((item,index)=>{

return <li key={index}>{item}</li>

})

}

</ul>

</div>

);

}

}

export default TodoList;

//定義函數(shù)
onClick={this.函數(shù)名}
//構(gòu)造函數(shù)
constructor(props){
????super(props);
????this.state={
??????list:[
???????'1',
???????'2'?
??????]
????}
}
//循環(huán)
{
????this.state.數(shù)據(jù).map((item)=>{
???????{item}
????})
}

子組件要想和父組件通信，子組件要先調(diào)父組件的方法

父組件通過(guò)屬性的方式向子組件傳遞參數(shù)，子組件通過(guò)props接收父組件傳來(lái)的參數(shù)。

react不需要直接操作DOM了
react的編程思想強(qiáng)調(diào)的是面向數(shù)據(jù)編程

render里面只能有一個(gè)包裹層，以前都寫(xiě)div，現(xiàn)在可以用<React.Fragment></React.Fragment>代替來(lái)包裹

父組件向子組件傳值通過(guò)屬性名，子組件用this.props.調(diào)用。

子組件向父組件傳值通過(guò)，父組件傳過(guò)來(lái)到方法比如this.props.delete(i)

講的不錯(cuò)，算是給我這個(gè)小白解惑了，以前真的是這么修改list的。以后知道要多...this.state.value。改數(shù)組要拷貝一份出來(lái)改

1. nodejs.org/en/

2. 下載LTS版本

3. 打開(kāi)命令行工具?

????????node -v查看node版本

????????npm -v查看npm版本 npm會(huì)跟隨node一起安裝

????打開(kāi)react官網(wǎng)，打開(kāi)Docs，打開(kāi)右邊Create a new React APP，然后往下找，復(fù)制npx create-react-app my-app，my-app是創(chuàng)建的文件的名字，然后按shift+鼠標(biāo)右鍵打開(kāi)命令行工具，復(fù)制進(jìn)去運(yùn)行，在文件里運(yùn)行命令npm start。

????npx create-react-app my-app

????cd my-app

????npm start

成功創(chuàng)建項(xiàng)目文件！

子組件要調(diào)用父組件傳遞過(guò)來(lái)的方法

this.props.方法名( )

組件拆分，一個(gè)組件拆分成多個(gè)組件的組合

父子組件的概念

父組件通過(guò)屬性(props)的方式傳遞參數(shù)給子組件