Question

我很想对Native和Javascript编程做出一般反应，我试图创建一个简单的To To＆＃39;在React Native和redux中的应用程序。

我试图添加“待办事项”＆＃39;到我的reducer中的数组，如下所示。

import * as types from '../actions/actionTypes'

const initialState = {
    data: []
};

export default function toDo(state = initialState, action) {

    let list
    console.log(action + " action")
    switch (action.type) {
        case types.ADD:
        list = state.data.concat([action.toDoData])
            return {
                ...state,
                data: list || []
            }
        default:
             return state;
    }
}

结果显示 AddToDo Results 你可以看到＆＃39; First Thing＆＃39;和＆＃39; Second Thing＆＃39;是我的两个添加结果，他们连续到同一行。

我的第一个想法是，我的哑巴或表现型ListView出现了问题，它将数据带到下面。

<MyList data={this.props.data}/>

所以我试过这个......

<MyList data={['firstThing', 'secondThing', 'thirdThing']}/>

它works !!!这就是我认为错误在reducer中的原因。

请告诉我其他代码会有用。任何见解都将受到青睐。

这是行动。

import * as types from './actionTypes.js';

export function addToList(toDoData) {
    return {
        type: types.ADD,
        toDoData: toDoData
    };
}

Answer 1

这里有一些关于你如何推动＆＃39;数据到数组

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Kiwi");

//fruits = ["Banana", "Orange", "Apple", "Mango", "Kiwi"];

或者你可以

export default function toDo(state = initialState, action) {
  switch (action.type) {
    case types.ADD:
      return {
        data: [...state.data, action.toDoData]
      }
    default:
      return state;
  }
}

Answer 2

你想要数组扩展运算符，即

export default function toDo(state = initialState, action) {
  switch (action.type) {
    case types.ADD:
      return {
        data: [...state.data, action.toDoData]
      }
    default:
      return state;
  }
}

Answer 3

你的action.toDoData数组？如果是，那么它应该是

state.data.concat（action.toDoData）

Answer 4

我认为，不知怎的，进入你的第一个循环，你将字符串添加到state.data中...... 尝试这样的事情： list = state.data.concat(action.toDoData)
或者用ES6传播：
list = [...state.data, action.toDodata]

Concat实际上连接而不是添加到数组。反应原生Javascript

4 个答案: