【问题标题】:How to use reducer function after setStatesetState后如何使用reducer函数
【发布时间】:2020-04-13 06:33:26
【问题描述】:

嗨,我想做 setState 然后运行函数。我收到此错误: 警告:来自 useState() 和 useReducer() Hooks 的状态更新不支持第二个回调参数。要在渲染后执行副作用,请使用 useEffect() 在组件主体中声明它。控制台。

我的代码:

import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { addPostOptions } from '../../actions/post';

const NewPostOptions = ({ addPostOptions, category: { selected } }) => {
    const [optionData, setOptionData] = useState({
        transaction_type: ''
    });



    const {
        transaction_type
    } = optionData;


    const onChange = e => {
        setOptionData({ ...optionData, [e.target.name]: e.target.value }, () => addPostOptions(optionData));
    }

    return selected.id === 1001 ? (
        <div class="form-group">
            <p>Hello</p>
        </div>
    ) :
        selected.id === 102 ? (
            <div class="form-group">
                <input
                    type="text"
                    placeholder="Title"
                    name="transaction_type"
                    value={transaction_type}
                    onChange={e => onChange(e)}
                />
                <small class="form-text">You should set a title</small>
            </div>
        ) :
            (
                <div></div>
            )
}

NewPostOptions.propTypes = {
    addPostOptions: PropTypes.func.isRequired
}

const mapStateToProps = state => ({
    category: state.category,
});

export default connect(mapStateToProps, { addPostOptions })(NewPostOptions)```

【问题讨论】:

    标签: javascript reactjs redux


    【解决方案1】:

    正如错误所说。删除 setOptionDate 函数中的第二个参数。并使用 useEffect。 每次更改 optionData 状态后都会运行效果。

    useEffect(() => {
       addPostsOptions(optionData);
    }, [optionData, addPostsOptions]);
    

    【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-02-10
    • 1970-01-01
    • 2018-10-05
    相关资源
    最近更新 更多