Question

我正在学习react-redux，当我用Provider包装App组件时，我不明白发生了什么问题。

错误：无效的挂机呼叫

https://i.stack.imgur.com/yFSnF.png

但是，如果我不包裹它就可以了。现在，我的问题是代码中的错误是什么？ 根组件：

import React from 'react';
   import ReactDOM from 'react-dom';
   import { Provider } from 'react-redux';
   import { createStore } from 'redux';

   import App from './components/App';
   import reducers from './reducers';


   const store = createStore(reducers);

   ReactDOM.render(
   <Provider store={store}>
    <App/>
   </Provider>   
   , 
   document.getElementById('root')
   );

应用程序组件：

import React from 'react';
import SongList from './songList';

const App = ()=>{
    return (
    <div>
        <SongList />
    </div>
    );
};

export default App;

歌曲列表组件：

import React from 'react';
class SongList extends React.Component{

    render(){
        return(
            <div className='ui divided list'>
                <div className='ui header'>
                    <div className='title'>
                        Song List
                    </div>
                </div>
                <div className='ui button primary'>
                    Select
                </div>
            </div>
        );
    }
};
export default SongList;

减速器：

import {combineReducers} from 'redux';

const songReducer = ()=>{
    return [
        {title:'Zikrullah', duration: 4.05},
        {title: 'Madina', duration: 5.50},
        {title: 'Sunnat', duration: 3.96},
        {title: 'Mandatory', duration:5.16}
    ]
};
const selectedSongReducer = (selectedSong = null, action) => {
    if(action.type === 'SONG_SELECTED'){
        return action.payload;
    }
    return selectedSong;
};

export default combineReducers({songs: songReducer, 
                 selectedSong: selectedSongReducer});

操作：

export const selectSong = (song)=> {
 return {
    type: 'SONG_SELECTED',
    payload:song
 };
};

我试图在两天内识别出错误的代码部分。我无法确定。请帮我解决问题。

如何解决“无效的挂机呼叫”？

0 个答案: