Redux в одноуровневом компоненте никогда не вызывается? - PullRequest
0 голосов
/ 06 июня 2018

На одной странице у меня два компонента.Один компонент получает значение из API, установленного в redux, а компоненту-брату необходим доступ к состоянию.Но компонент-брат никогда не вызывал функцию mapStateToProps.

Код для получения данных в редукте в узле песни:

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);

1 Ответ

0 голосов
/ 07 июня 2018

Я думаю, что проблема в том, что вы экспортируете класс в его объявлении (export class Player extends Component) и снова используете export default с функцией соединенияact-redux.

Таким образом, в вашем компоненте Songs вы, вероятно, импортируете его с помощью фигурных скобок, который импортирует класс, но не класс с обернутой вокруг него функцией connect.Если вы импортируете без фигурных скобок, он импортирует экспорт «по умолчанию».

Вы должны удалить фигурные скобки из импорта в компоненте Songs, а также, вероятно, удалить «экспорт» из объявления класса, если вымы всегда будем использовать подключенный к редукту компонент.

...