Question

我刚开始使用打字稿，所以请原谅我正盯着解决方案。我的组件如下

import './weatherInfo.css';

import * as React from 'react';
import { connect } from 'react-redux';

import IWeatherInfo from '../../models/WeatherInfo';
import {IApplicationState} from '../../reducers';
import WeatherInfo from './weatherInfoItem';

interface IWeatherInfoList{
  weatherInfoList:IWeatherInfo[]
}
class WeatherInfoList extends React.Component<IWeatherInfoList> {

  componentWillReceiveProps(){
    console.log("Component will recieve props"); <------ 1
  }

   render() {
    console.log(this.props.weatherInfoList);
    return (
      <div className="weatherInfoContainer">
        {this.props.weatherInfoList.map((weatherInfoItem, index)=>{
          debugger
          return (<WeatherInfo key={index}  {...weatherInfoItem}/>);
        })}
      </div>
    );
  }
}

function mapStateToProps(state: IApplicationState):IWeatherInfoList {
<------- 2
    return {
      weatherInfoList: state.weatherInfo.citiesWeatherData
    }
}

const mapDispatchToProps = {

};
export default connect(mapStateToProps, mapDispatchToProps)(WeatherInfoList);

state.weatherInfo.citiesWeatherData的类型为IWeatherInfo []

现在，每当我更新商店状态时，一切看起来都很好，商店就会得到更新。但是该组件不会获得新的道具（因此不会重新渲染）。因此，我在2和1处设置了一个断点。它在2处停止，但在1处没有。我尝试将weatherInfoList的类型更改为字符串数组，然后它开始工作。我在这里想念什么？

打字稿mapStateToProps不更新组件道具

0 个答案: