Магазин и сервер не синхронизированы - PullRequest
0 голосов
/ 07 июля 2019

Когда я использую метод PUT для axios и я помещаю данные на сервер, данные помещаются в старые данные и сервер не обновляется, но хранилище изменяется при выполнении действия, кажется, что хранилище и серверне синхронизированы.

apiCaller.js

const API_URL = 'https://s39o5.sse.codesandbox.io' ;
export default function callApi(endpoint, method = 'GET', body){
    return axios({
        method: method,
        url: `${Config.API_URL}/${endpoint}`,
        data: body
    }).catch(err => {
        console.log(err);
    });
};

action / index.js

export const fetchIsActiveList = (users)=>{
    return dispatch =>{
        return callApi (`list/${users.id}`,'PUT',users).then(res =>{
            dispatch(itemRequestActive(res.data))
        }) ;
    }
}
export const itemRequestActive = (id) => {
    return {
        type: ITEM_REQUEST_ACTIVE,
        id
    }
}

компоненты / ListItems.js

componentDidMount() {
  var { match } = this.props;
  var id = match.params.id;
  this.props.fetchAllListItem(id);
} 

onAccept(user) {
  this.props.fetchIsActive(user);
} 

render { 
     const { user } = this.props;
  return (){
  <div>
  { user.map((user, index) =>(
 ...
    <h5 onClick={() => this.onAccept(user)} >Accept</h5>
    ))}

   </div>
  }
} 

const mapStateToProps = (state) => {
  return {
    user: state.listItems,
  }
} 

const mapDispatchToProps = (dispatch) => {
  return {
    fetchAllListItem: (id) => {
      dispatch(actFetchListItemRequest(id))
    },
    fetchIsActive: (user) => {
      dispatch(fetchIsActiveList(user));
    }
  }
}

редукторы / ListItem

export const list = ( state = initialState, action ) => {
  switch (action.type) {
    case FETCH_LIST:      
      return [... action.list];
    case IS_ACTIVE_LIST:
      return state.map(i => i.id !== action.id.id ? 
        { ...i , active: false } : { ...i, active: true});
    default:
      return state
  }
}
...