发送REDX功能

Question

我很新的REDX，我创建了一个基本的摇滚纸剪刀应用程序。但是我不确定如何传入一个函数。用户界面如下：

let App = ({humanScore,computerScore,userWinsGame,computerWinsGame}) => { 

return (
    <div> 
     Human:{humanScore} 
     Computer: {computerScore} 
    <br/> 
    <button value='Rock' onClick={(e) => userChoice(e.target.value)} >Rock</button> 
    <button value='Paper' onClick={(e) => userChoice(e.target.value)} >Paper</button> 
    <button value='Scissors' onClick={(e) => userChoice(e.target.value)} >Scissors</button> 
    <button onClick={() => userWinsGame()} >UserWins</button> 
    <button onClick={() => computerWinsGame()} >ComputerWins</button> 
    </div> 
); 
}; 

的userChoice功能如下：

let userChoice = (userInput) => { 
    var computerInput = computerChoice(); 
    console.log("TEST" + userInput); 
    if (
     (userInput == 'Rock' && computerInput == 'Scissors')|| 
     (userInput == 'Paper' && computerInput == 'Rock') || 
     (userInput == 'Scissors' && computerInput == 'Paper') 
    ) { 
     {comWins}; 
     console.log('User chose ' + userInput + 'Computer chose ' + computerInput); 
    } else { 
     console.log('User chose ' + userInput + 'Computer chose ' + computerInput); 
    } 
    } 

和应用程序容器是这样的：

let AppContainer = connect(
state => ({ 
    humanScore: state.getIn(['data', 'users','human']), 
    computerScore: state.getIn(['data', 'users','computer']) 
}), 
dispatch => ({ 
    comWins:() => dispatch(computerWins()), 
    userWinsGame:() => dispatch(userWins()), 
    computerWinsGame:() => dispatch(computerWins()) 
}) 
)(App); 

不过，我不断收到消息“comWins '没有定义no-undef。对不起，不好的描述，但任何帮助将不胜感激！

减速器低于：

const initialState = fromJS({ 
    users: { 
    human: 0, 
    computer: 0 
    } 
}); 


const dataReducer = handleActions({ 
    [actionTypes.USER_WINS]: (state) => 
     state.setIn(['users','human'], 
state.getIn(['users','human'])+1), 
    [actionTypes.COMPUTER_WINS]: (state) => 
     state.setIn(['users','computer'],state.getIn(['users','computer'])+1), 
}, 
initialState); 

我的操作文件是这样的：

const actionTypes = mirrorKeyValue([ 
'USER_WINS', 
'COMPUTER_WINS' 

]）;

const { 
userWins, 
computerWins, 
} = createActions({ 
[actionTypes.USER_WINS]:() => ({}), 
[actionTypes.COMPUTER_WINS]:() => ({}) 

}); 


export {actionTypes, 
    userWins, 
    computerWins} 

Answer 1

你不及格comWins在应用

let App = ({humanScore,computerScore,userWinsGame,computerWinsGame}) => { 

但试图利用{comWins};

这就是为什么它被赋予not defined error

你也可以把它作为{props.comWins()}不及格在App中。

Answer 2

let App = ({humanScore,computerScore,userWinsGame,computerWinsGame}) => { 

return (
    <div> 
    //You are directly getting score here 
     Human:{humanScore} 
     Computer: {computerScore} 
    <br/> 
    <button value='Rock' onClick={(e) => userChoice(e.target.value)} >Rock</button> 
    <button value='Paper' onClick={(e) => userChoice(e.target.value)} >Paper</button> 
    <button value='Scissors' onClick={(e) => userChoice(e.target.value)} >Scissors</button> 
    //no need to call extra functions 
    </div> 
); 
}; 


let userChoice = (userInput) => { 
    var computerInput = computerChoice(); 
    console.log("TEST" + userInput); 
    if (
     (userInput == 'Rock' && computerInput == 'Scissors')|| 
     (userInput == 'Paper' && computerInput == 'Rock') || 
     (userInput == 'Scissors' && computerInput == 'Paper') 
    ) { 
     //calling user winning function here 
     {userWinsGame()}; 
     console.log('User chose ' + userInput + 'Computer chose ' + computerInput); 
    } else { 
     //calling computer wining function 
computerWinsGame() 

     console.log('User chose ' + userInput + 'Computer chose ' + computerInput); 
    } 
    }