永远不会调用兄弟组件中的 Redux？

Question

在一页上我有两个组件。一个组件从 redux 中设置的 api 获取值，兄弟组件需要访问状态。但是兄弟组件从未调用过 mapStateToProps 函数。

歌曲节点中redux获取数据的代码：

Songs.propTypes = {
topTrendingSongs: PropTypes.object,
song: PropTypes.object,
getHomeTopTrendingSongs: PropTypes.func.isRequired,
getUrls: PropTypes.func.isRequired,
getSong: PropTypes.func.isRequired
}

function mapStateToProps(state) {    
        console.log('Type IS : ', typeof state.songsReducer.song_one);
return {
    data: state.homeReducer.topTrendingSongs,
    song: state.songsReducer.song
}
}

export default connect(mapStateToProps, { getUrls, getHomeTopTrendingSongs, getSong })(Songs);

从未在同级组件中调用以下调用：

import React, { Component } from 'react';
import { Link } from 'react-router-dom';
import playerIcon from '../img/playerIcon.svg';
import Pause from '../img/pause.svg';

import { connect } from 'react-redux';

export class Player extends Component {
 constructor(props) {
 super(props);

  this.state = {
   player: false,
   cSong: JSON.parse(localStorage.getItem('CurrentSong'))
   }
 }
 componentDidMount() {
   console.log('current song data', this.props.song);        
 }


  render() {
    return (
    <div id="min-player" className="min-player">        
      <video id="video"></video>
    </div>
   );
  }
}

 function mapStateToPropss(state) {
 console.log('all state', state);
 return {
  song: state.songsReducer.song
}
}

export default connect(mapStateToPropss)(Player);

Answer 1

我认为问题在于您在其声明 (export class Player extends Component) 中导出 class，并且您再次使用 export default 和 react-redux 的连接功能。

因此，在您的 Songs 组件中，您可能会使用大括号导入它，这会导入 class，但不会导入带有 connect 函数的 class。如果您在没有大括号的情况下导入，它将导入 "default" 导出。

如果您总是要使用 redux 连接组件，您应该从 Songs 组件的导入中删除大括号，并且还可能从 class 声明中删除 "export"。

永远不会调用兄弟组件中的 Redux？

Redux in sibling component is never called?

reactjs

redux

redux-thunk

react-redux