indexOf js первый раз отрабатывает, второй выдает ошибку Cannot read property 'indexOf' of undefined
const day = new Date().toLocaleDateString();
const inialState = {
tasks: [
[{nameTask: "Первая задача", dateTask: "12.12.2020", startAt: "08:50"},{nameTask: "Второя задача", dateTask: "12.12.2020", startAt: "08:20"},{nameTask: "Третья задача", dateTask: "12.12.2020", startAt: "08:40"}],
],
today: day,
days: ['12.12.2020']
}
export default function (state = inialState, action){
switch(action.type){
case 'addTask':
const nameInput = document.getElementById('add-task__name')
const startAtInput = document.getElementById('add-task__start-at')
const dateInput = document.getElementById('add-task__date')
console.log("dateInput is ",dateInput)
let task = [{
nameTask: nameInput.value,
dateTask: dateInput.value,
startAt: startAtInput.value
}]
console.log("dateInput is ",task[0].dateTask, task[0].nameTask)
const indexOfTask = state.days.indexOf(task[0].dateTask)// **выдает ошибку при повторном использовании**
// const indexOfTask = state.tasks.findIndex(i => i.dateTask === task[0].dateTask);
if(indexOfTask ==-1){
state.tasks.push(task)
state.days.push(task[0].dateTask)
}else{
state.tasks[indexOfTask].push(task[0])
}
return {
tasks: state.tasks
}
default:
return state
}
}
// откуда берутся данныеlayout component
import React, {Component} from 'react'
import './layout.scss'
import {connect} from 'react-redux'
class Layout extends Component {
render() {
return (
<div className="layout">
<main>
<div className="addTask">
<form action="">
<input id="add-task__name" type="text" placeholder="Введите название задачи"/>
<input id="add-task__date" type="text" placeholder="Введите дату" placeholder={this.props.today}/>
<input id="add-task__start-at" type="text" placeholder="Время начала"/>
<a onClick={() =>{this.props.addTask()}} >Сохранить</a>
</form>
</div>
{ this.props.children }
</main>
</div>
)
}
}
function mapStateToProps(state){
return{
today: state.tasksReducer.today
}
}
function mapDispatchToProps(dispatch){
return{
addTask: () => dispatch({type:"addTask"})
}
}
export default connect(mapStateToProps, mapDispatchToProps)(Layout)
Ответы (1 шт):
Автор решения: 1ocke
→ Ссылка
Возможно дело в том, что вы не возвращаете остальной state, состоящий из today и days.
export default function (state = inialState, action){
switch(action.type){
case 'addTask':
const nameInput = document.getElementById('add-task__name')
const startAtInput = document.getElementById('add-task__start-at')
const dateInput = document.getElementById('add-task__date')
console.log("dateInput is ",dateInput)
let task = [{
nameTask: nameInput.value,
dateTask: dateInput.value,
startAt: startAtInput.value
}]
console.log("dateInput is ",task[0].dateTask, task[0].nameTask)
const indexOfTask = state.days.indexOf(task[0].dateTask)// **выдает ошибку при повторном использовании**
// const indexOfTask = state.tasks.findIndex(i => i.dateTask === task[0].dateTask);
if(indexOfTask ==-1){
state.tasks.push(task)
state.days.push(task[0].dateTask)
}else{
state.tasks[indexOfTask].push(task[0])
}
// Возвращаем остальной стейт
return {
...state,
days: state.days,
tasks: state.tasks,
};
default:
return state
}
}
