Приложение React-Redux, созданное в Visual Studio 2017, выдает ошибки компиляции в коде Visual Studio
Я создал образец приложения, выбрав шаблон React-Redux, представленный в Visual Studio 2017.
Пример кода компилируется и запускается, как и ожидалось, когда я использую Visual Studio 2017 IDE. Но когда я использую код Visual Studio, я получаю ошибки времени компиляции для некоторых файлов. Один такой ошибочный пример файла кода "FetchData.tsx", как показано ниже:
import * as React from 'react';
import { Link, RouteComponentProps } from 'react-router-dom';
import { connect } from 'react-redux';
import { ApplicationState } from '../store';
import * as WeatherForecastsState from '../store/WeatherForecasts';
type WeatherForecastProps =
WeatherForecastsState.WeatherForecastsState // ... state we've requested from the Redux store
& typeof WeatherForecastsState.actionCreators // ... plus action creators we've requested
& RouteComponentProps<{ startDateIndex: string }>; // ... plus incoming routing parameters
class FetchData extends React.Component<WeatherForecastProps, {}> {
public render() {
return <div>
<h1>Weather forecast</h1>
<p>This component demonstrates fetching data from the server and working with URL parameters.</p>
</div>;
}
}
export default connect(
(state: ApplicationState) => state.weatherForecasts, // Selects which state properties are merged into the component's props
WeatherForecastsState.actionCreators // Selects which action creators are merged into the component's props
)(FetchData) as typeof FetchData;
Онлайн (FetchData) as typeof FetchData;
Я получаю ошибку ниже в коде Visual Studio, но НЕ В Visual Studio 2017:
Тип typeet FetchData нельзя назначить типу StatelessComponent. Тип 'typeof FetchData' не соответствует подписи '(props: WeatherForecastsState & { children?: ReactNode; }, context?: any): ReactElement | ноль'.
Любая помощь по этому вопросу приветствуется. Благодарю.
1 ответ
Я не смог найти причину того, почему код работает на VS2017, а не на коде Visual Studio. Итак, в качестве обходного пути мне пришлось разделить параметры для метода Connect-Redux Connect, как показано ниже, и он работал как ожидалось:
export default connect(
(state: ApplicationState) => state.weatherForecasts,
WeatherForecastsState.actionCreators
)(FetchData) as typeof FetchData;
ИЗМЕНИЛСЯ НА
const mapStateToProps = (state: ApplicationState): WeatherForecastProps => {
return {
forecasts:state.weatherForecasts.forecasts
} as any
};
const mapDispatchToProps = (dispatch:any): any => {
return bindActionCreators({
requestWeatherForecasts:
WeatherForecastsState.actionCreators.requestWeatherForecasts
}, dispatch);
};
export default connect(
mapStateToProps,
mapDispatchToProps
)(FetchData);