Redux Thunk не отправляется - PullRequest
Новая
       83

Redux Thunk не отправляется

0 голосов
/ 03 мая 2020

Я установил Redux Thunk на свое приложение, и до сих пор оно работало нормально, все предыдущие действия, которые я создал, успешно извлекают данные из API, однако следующее действие даже не направляет действия на мой редуктор, идея, что я пропускаю? 

// my action
export const fetchClub = id => {
debugger
return (dispatch) => {
    if (id){
    dispatch ({type: 'START_PULLING_NIGHTCLUB'});
    let targetUrl = `http://localhost:3001/nightclub`
    fetch(targetUrl)
    .then(res => {
        debugger
        return res.json()
      })
    .then(nightclub => dispatch({type: 'CURRENT_NIGHTCLUB', nightclubs: nightclub.result}))
    .catch(error => {
        console.log(error)
    })

}}} 

//my reducer

    import {combineReducers} from "redux"



const rootReducer = combineReducers({
    nightclubs: nightClubsReducer,
    user: userReducer
})

export default rootReducer

function nightClubsReducer(state = {}, action) {
    debugger
    switch (action.type){
        case 'ADD_NIGHTCLUBS':
            debugger
            let nightclubs = action.nightclubs
            // filering the results just to show nightclubs rather than hotels
            nightclubs = nightclubs.filter( function (nightclub){
                return !nightclub.types.includes("lodging")
            })
          return {...state.nightclubs, nightclubs}
        case 'CURRENT_NIGHTCLUB':
            debugger
            let nightclub = action.nightclub
            return {...state.nightclubs, nightclub}    
    default:
        return state
}}

function userReducer(state = {user: {logged_in: false}}, action){
    let current_user = {}
    switch (action.type){
        case 'ADD_USER_LOCATION':
            let coords = action.location.coords
            return {...state.user, coords}
        case 'CREATE_USER':    
            current_user = action.user
            state.logged_in = true
            return {...state.user, current_user}
        case  'ADD_LOGGED_IN_USER':
            current_user = action.user
            if(state.user){
            state.user.logged_in = action.user.logged_in} 
            return {...state.user, current_user}
        default:
            return state
    }
}

Я должен нажать на отладчик в первой строке моего nightClubsReducer, однако ничего не происходит. Мой компонент ночного клуба подключен должным образом, насколько мне известно: 

    import React, { Component } from 'react';
import Maya from '../assets/Mayaclubbio.jpg'
import '../NightClubPage.css'
import { connect } from 'react-redux';
import { fetchClub } from '../actions/NightClubs';

class NightClub extends Component {

    constructor(props) {
        super(props);
        this.id = props.match.params.id
    }

    componentDidMount() {
        fetchClub(this.id)
    }

    render() {
        debugger
        return (
            <React.Fragment>
               //HTML code
            </React.Fragment>
        )
    }
}

const mapStateToProps = (state) => {
    debugger
    return {
      nightclub: state.nightclubs.nightclub,
      user: state.user
    }
  }

export default connect(mapStateToProps, { fetchClub })(NightClub);

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

1 Ответ

1 голос
/ 04 мая 2020

Я думаю, что вызов действия из реквизита должен исправить вашу проблему 

componentDidMount() {
 this.props.fetchClub(this.id);
}
...