-
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});}//构造器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');
}
//构造器
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;
查看全部 -
//定义函数 onClick={this.函数名} //构造函数 constructor(props){ super(props); this.state={ list:[ '1', '2' ] } } //循环 { this.state.数据.map((item)=>{ {item} }) }
查看全部 -
子组件要想和父组件通信,子组件要先调父组件的方法
查看全部 -
父组件通过属性的方式向子组件传递参数,子组件通过props接收父组件传来的参数。
查看全部 -
react不需要直接操作DOM了
react的編程思想強調的是面向數據編程查看全部 -
1.react组件间传值 父组件向子组件进行传值通过参数的形式传递查看全部
-
render里面只能有一个包裹层,以前都写div,现在可以用<React.Fragment></React.Fragment>代替来包裹
查看全部 -
父组件向子组件传值通过属性名,子组件用this.props.调用。
子组件向父组件传值通过,父组件传过来到方法比如this.props.delete(i)
查看全部 -
讲的不错,算是给我这个小白解惑了,以前真的是这么修改list的。以后知道要多...this.state.value。改数组要拷贝一份出来改
查看全部 -
展开运算符 ...查看全部
-
nodejs.org/en/
下载LTS版本
打开命令行工具
node -v查看node版本
npm -v查看npm版本 npm会跟随node一起安装
打开react官网,打开Docs,打开右边Create a new React APP,然后往下找,复制npx create-react-app my-app,my-app是创建的文件的名字,然后按shift+鼠标右键打开命令行工具,复制进去运行,在文件里运行命令npm start。
npx create-react-app my-app
cd my-app
npm start
成功创建项目文件!
查看全部 -
子组件要调用父组件传递过来的方法
this.props.方法名( )
查看全部 -
组件拆分,一个组件拆分成多个组件的组合
父子组件的概念
查看全部 -
父组件通过属性(props)的方式传递参数给子组件
查看全部
举报