this.state.list.map() 改为 this.state.list.forEach()之后为什么会出错

来源:3-3 实现 TodoList 新增删除功能

慕移动5552466

2020-01-05

写回答

3回答

RadiomM

2020-03-28

如果你是跟老师的一样写法的话,那你就应该了解一下forEach与map,filter的区别了。forEach是没有返回值的

0
0

倾城一笑stu

2020-01-07

import React, { Component } from 'react'
import { connect } from 'react-redux'
import * as actions from '../store/actionCreator'

// 使用react-redux来获取store
// 使用无状态组件提高性能
const TodoList2 = (props) => {
const { list, inputValue, changeInput, add, handleDelete } = props;
let arr=[];
list.forEach((t, i) => {
arr.push(
<li key={i}>
<span>{t}</span>
<button onClick={() => handleDelete(i)}>删除</button>
</li>
)
})
return (
<div>
<input value={inputValue} onChange={changeInput} />
<button onClick={add}>提交</button>
<ul>{arr}</ul>
</div>
)
}
// 把store的state映射到组件的props里面
const mapStateToProps = (state) => {
return {
inputValue: state.inputValue,
list: state.list
}
}
// 把dispath的方法映射到props里
const mapDispatchToProps = (dispatch) => {
return {
changeInput(e) {
dispatch(actions.getInputChange(e.target.value))
},
add() {
dispatch(actions.getAddList())
},
handleDelete(index = 0) {
dispatch(actions.getDeleteList(index))
}
}
}
// 连接store和TodoList2
export default connect(mapStateToProps, mapDispatchToProps)(TodoList2)

forEach实现会比map复杂很多。。。。。。。。

0
0

Dell

2020-01-06

报错截图发出来看下

0
0

React零基础入门到实战,完成企业级项目简书网站开发

主流新技术 React-redux,React-router4,贯穿基础语法

5275 学习 · 2496 问题

查看课程