Question

我是React-Redux的新手，我正在尝试使用Material-ui TextField构建类似绑定的表单，并在发生任何更改时在div中显示其内容。有我的代码：

TextField组件：

handleHead = event => {
  store.dispatch(newTitle(event.target.value));
}
render() {
return (
    <div>
       <div style={MDStyle}>
            <TextField style={dblock} 
              floatingLabelText='Title' 
              onChange={this.handleHead}
          fullWidth={true}/>
    </div>);
 }

减速

import { combineReducers } from 'redux';

function markdown(state = [], action) {
    switch (action.type) {
        case 'NEW_TITLE':
          return Object.assign({}, state, {
            title: action.text
          });
        default:
          return state;
    }
} 

export default combineReducers({ markdown });

商品

import { createStore } from 'redux';
import reducers  from '../reducers/Reducers';

const initialState = {
  markdown: {
    title: ''
  }
};

const store = createStore(reducers, initialState);
export default store;

当我尝试在输入中键入内容时，问题就出现了，它失去了焦点，我无法继续输入任何内容。似乎组件重新渲染。解决这个问题的最简单方法是什么？考虑到在react-form甚至refs之前已经解决了这些问题，您能否给我一些指导方针或最佳实践来解决这个问题？

使用react / redux构建绑定表单的更好方法是什么？

0 个答案: