Как обновить мое начальное состояние в редукторном редукторе

Question

Привет! У меня есть этот контейнер со списком пользователей, который отображает также контейнер с пользовательской формой. Я просто поместил оба контейнера в if, что при начальной загрузке страницы будет отображаться список пользователей. После нажатия кнопки «Добавить пользователя» будет отображена форма пользователя.

Как я могу изменить состояние isAddUser из моих редукторов, когда я нажимаю кнопку isAddUser .?

addUser(){
    //button to show add user form 
    //update the reducers initial state isAddUser
}

if(this.props.isAddUser){
    return (
        <div className="row">
            <div className="container table-responsive">
                <UserForm/>
            </div>
        </div>
    )
} else {
    return(
             <div className="row">
                <div className="container table-responsive">
                    <div className="text-right"> 
                        <button 
                            className="btn btn-primary text-right"
                            onClick={this.addUser.bind(this)}>
                            Add User
                        </button>
                    </div>
                    <table className="mt-1 table table-hover">
                        <thead className="thead-light">
                            <tr>
                                <th>Name</th>
                                <th>Username</th>
                                <th>Email</th>
                                <th></th>
                            </tr>
                        </thead>                
                        {userList}  
                    </table>
                </div>    
            </div> 
          )
      }
}


const mapStateToProps = state => ({
    users: state.users.items,
    isAddUser: state.users.isAddUser
})

export default connect(mapStateToProps, { fetchUsers, deleteUser })(UserList);

редукторы

Мне нужно обновить isAddUser: от false до true от начального состояния

import { FETCH_USERS, DELETE_USER } from '../actions/User/Types';

const initialState = {
   items: [],
   item: {},
   isAddUser: false
}
export default function(state = initialState, action){
    switch(action.type){
        case FETCH_USERS:
          //code here

        case DELETE_USER:
          //code here

        default: 
           return state;
    }
}

Answer 1

создать новое действие под названием UPDATE_ADD_USER. когда вы вызываете эту переменную обновления действия.

case UPDATE_ADD_USER:
        return {...state, isAddUser: true};

Создайте действие как fetchUsers, deleteUser и отправьте его в список действий.

export default connect(mapStateToProps, { fetchUsers, deleteUser,updateAddUser })(UserList);

В addUser функция

addUser(){
   this.props.updateAddUser();//call new action created
}