Redux无状态组件(函数式组件)的使用（提升性能）

删除this，用props作为参数代替this.props

性能比类组件性能优秀

JSX语法必须引入React

TodoListUI.js

import React from 'react'
import {Input,Button,List} from 'antd'

const TodoListUI=(props)=>{
    return (
        <div style={{margin:'10px'}}>
        <div><Input 
    placeholder={props.inputValue}
    style={{width:'250px',marginRight:'10px'}}
    onChange={props.changeInputValue}
    value={props.inputValue}
    />
    <Button type='primary'
        onClick={props.clickBtn}
    >增加</Button>
    </div>
    <div style={{margin:'10px',width:'300px'}}>
        <List 
        bordered 
        dataSource={props.list}
        // renderItem={(item,index)=>(<List.Item onClick={this.deleteItem.bind(this,index)}>{item}</List.Item>)}
        renderItem={(item,index)=>(<List.Item onClick={()=>{props.deleteItem(index)}}>{item}</List.Item>)}
       />
          
    </div>
    </div>
      );
 }
export default TodoListUI;