在redux存储中复制嵌套对象

时间:2017-07-30 07:09:44

标签: reactjs redux react-redux

为什么我的redux商店中存在重复的嵌套public static VideoThumbnailThreadPoolManager getInstance() { public void downloadThumbnail(String url, DownloadCompleteListener listener) { mExecutor.execute(new ImageDownloaderThread(url, listener)); } private class ImageDownloaderThread extends Thread { String mUrl; DownloadCompleteListener mListener; ImageDownloaderThread(String url, DownloadCompleteListener listener) { setName(url); mUrl = url; mListener = listener; } @Override public void run() { try { Bitmap thumbnail = GeneralUtils.retriveVideoFrameFromVideo(mUrl); if (mListener != null) { mListener.onThumbnailDownloaded(thumbnail); } } catch (Throwable throwable) { throwable.printStackTrace(); if (mListener != null) { mListener.onThumbnailDownloaded(null); } } } } public void killThreadBy(String name) { //Give you set of Threads Set<Thread> setOfThread = Thread.getAllStackTraces().keySet(); //Iterate over set to find yours for (Thread thread : setOfThread) { if (thread.getName().equals(name)) { thread.interrupt(); } } } } 对象?

enter image description here

组件/ todoInput.js

todos

减速器/ todo.js

import React, { Component } from 'react';
import PropTypes from 'prop-types';

import actions from '../../actions';

class TodoInput extends Component {
  constructor(props) {
    super(props);

    this.state = {
      inputText: ''
    };

    this.handleChange = this.handleChange.bind(this);
    this.handleClick = this.handleClick.bind(this);
  }

  handleChange(e) {
    this.setState({
      inputText: e.target.value
    });
  }

  handleClick(e) {
    e.preventDefault();

    this.props.dispatch(actions.addTodo(this.state.inputText));
  }

  render() {
    return (
      <div>
        <input
          type="text"
          placeholder="todo"
          value={this.state.inputText}
          onChange={this.handleChange}
          />
        <button onClick={this.handleClick}>Sumbit</button>
      </div>
    );
  }
}

TodoInput.propTypes = {
  dispatch: PropTypes.func,
};

export default TodoInput;

2 个答案:

答案 0 :(得分:2)

您自己提供了嵌套结构。 todos reducer在状态对象中创建一个todos键,并且您提供了一个初始值:

todos: [{
  id: 0,
  text: 'Initial Todo',
  completed: false
}]

因此,这个reducer创建的状态切片是:

todos: {
  todos: [{ ... }]
}

只需将初始状态声明为数组,而不是使用todos键声明对象。听起来这就是你想要的。

答案 1 :(得分:0)

减速器通常住在商店的一个分店,由您创建商店的方式决定。

使用redux docs中的示例:

import { combineReducers } from 'redux'
import todos from './todos'
import counter from './counter'

export default combineReducers({
    todos,
    counter
})

这将创建一个具有以下结构的商店:

{   
    todos: ...,
    counter: ...,
}

这些分支中的内容由单个reducer决定,它不应该知道整个商店的结构。

在您的情况下,您的reducer正在创建另一个名为todos的密钥,这就是您看到重复的原因。