Магазин Redux «Недвижимость ХХ не существует» - PullRequest
0 голосов
/ 23 апреля 2019

Я пытаюсь настроить свой первый проект с Redux, но борюсь с последними деталями. Когда я пытаюсь использовать stateProps, я получаю ошибку Property XX does not exist on type (...), когда пытаюсь получить доступ к this.props.isLoading, который является свойством Store. Я использую React Redux и Router.

РЕДАКТИРОВАТЬ: У меня те же проблемы с mapDispatchToProps, но я показываю только реквизиты состояния здесь. (Надеясь, что решение для состояний также решит проблемы с диспетчеризацией)

Вот соответствующий код:

myReducer.ts в / редукторы

export default function reducer(
state = {
    isLoading: false,
},
action: any
    ): Record<string, any> {
    switch (action.type) {
        case "SET_LOADING": {
            return { ...state, earningHistorySolved: true };
        }
        default:
            return state;
    }
}

Index.ts в каталоге редуктора

import { combineReducers } from "redux";
import myReducer from "./reducers";

export default combineReducers({
   myReducer 
});

myAction.ts

export function setLoading(): Record<string, any> {
    return {
        type: "SET_LOADING",
        payload: {
            testPayload: 1
        }
    };
}

App.tsx

class App extends Component {
    render(): React.ReactNode {
        return (
            <Provider store={store}>
                <Router>
                    <div>
                        <TopSection />
                        <Route exact path="/" component={StartCase} />
                        <Route
                            path="/cars/:carId/bike/:No"
                            component={Content}
                        />
                    </div>
                </Router>
            </Provider>
        );
    }
}
export { App }

Файл, в котором я пытаюсь использовать реквизит , (ошибка при this.props.isLoading)

import React, { Component, ReactNode } from "react";
import { RouteComponentProps, withRouter } from "react-router-dom";
import { connect } from "react-redux";

interface IMyList {
    group?: number,
}

class myList extends Component<RouteComponentProps<any> & IMyList > {
    constructor(props: any) {
    super(props);
    }

    render(): ReactNode {
        return (
            <Layout>
                <Button flagged={this.props.isLoading}/>
            </Layout>
        );
    }
}

const mapStateToProps = function mapStateToProps(state: any): Record<string, any> {
    return {
        isLoading: state.myReducer.isLoading,
    };
};

export default withRouter(connect(mapStateToProps)(myList));

1 Ответ

0 голосов
/ 23 апреля 2019

Это больше похоже на проблему TypeScript, чем на Redux, я не эксперт по TS, но, как я вижу, вы не предоставляете никакого определения для isLoading в определении вашего компонента.

Будет выглядеть , как если бы вы только что забыли добавить isLoading к вашему IMyList интерфейсу

interface IMyList {
  group?: number,
  isLoading: boolean
}
...