当前位置:  开发笔记 > 编程语言 > 正文

使用输入更新redux状态

如何解决《使用输入更新redux状态》经验,为你挑选了1个好方法。

如何从文本输入更新redux的状态?

我正在尝试用文本输入做一个非常简单的"Hello World".当有人输入文本输入时,它应该更新我的商店的"searchTerm"值.

我无法弄清楚这些事情:1.我怎样才能将输入的值传递给它的"onChange"处理程序?2."搜索"操作似乎被正确调用,但我的reducer函数从未使用过(没有console.log).

SearchForm.js(组件)

import React, {Component, PropTypes} from 'react';
import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';
import {search} from 'redux/modules/search-term';

@connect(
  null,
  dispatch => bindActionCreators({ search }, dispatch)
)

export default class SearchForm extends Component {
  static propTypes = {
    search: PropTypes.func.isRequired,
  }

  render() {
    return (
      
    );
  }
}

search-term.js(动作和减速器)

const SEARCH = 'redux-example/repo-filter/SEARCH';

const initialState = {
  searchTerm: null
};

export default function reducer(state = initialState, action = {}) {
  console.log("reducing");

  switch (action.type) {
    case SEARCH:
      return {
        searchTerm: action.term
      };
    default:
      return state;
  }
}

export function search(term) {
  return {
    type: SEARCH,
    term
  };
}

reducer.js

import { combineReducers } from 'redux';
import multireducer from 'multireducer';
import { routerStateReducer } from 'redux-router';

import search from './search-term';

export default combineReducers({
  router: routerStateReducer,
  search
});

Atanas Korch.. 7

this.props.search在将动作创建者绑定到change事件时应该使用:

this.props.search(event.target.value)} />



1> Atanas Korch..:

this.props.search在将动作创建者绑定到change事件时应该使用:

this.props.search(event.target.value)} />

推荐阅读
手机用户2402852307
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有