爲什麼在調度一個動作時我得到了`null`？

Question

console.log(bankStore.getState().balance); 

當我記錄這個，我得到0預期。

然後我有傳遞道具<BankApp />組分（如我明白）容器：

const mapStateToProps = state => { 
    return { 
    balance: state.balance 
    }; 
}; 
const mapDispatchToProps = dispatch => { 
    return { 
    onDeposit: amount => dispatch(depositIntoAccount(amount)), 
    }; 
}; 
const BankAppContainer = connect(mapStateToProps, mapDispatchToProps)(BankApp); 

這是我的<BankApp />組分，其從BankAppContainer接收道具：

class BankApp extends React.Component { 
    state = { 
    amount: 0 
    }; 

    onInputChange = e => { 
    const amount = e.target.value; 
    this.setState({ amount }); 
    }; 

    onDeposit = e => { 
    e.preventDefault(); 
    this.props.onDeposit({ 
     amount: parseFloat(this.state.amount, 10) 
    }); 
    this.setState({ amount: 0 }); 
    }; 

    render() { 
    return (
      <form> 
      <input 
       type="text" 
       onChange={this.onInputChange} 
       placeholder="add num" 
       value={this.state.amount} 
      /> 
      <br /> 
      <div> 
       <br /> 
       <button onClick={this.onDeposit}>deposit</button> 
       <button>withdraw</button> 
      </div> 
      </form> 

這是我的動作創建者存款帳戶帳戶：

export const depositIntoAccount = amount => ({ 
    type: "DEPOSIT_INTO_ACCOUNT", 
    amount 
}); 

，這是我的應用程序減速機：

export default (state = { balance: 0 }, action) => { 
    switch (action.type) { 
    case "DEPOSIT_INTO_ACCOUNT": 
     return { 
     balance: state.balance + parseFloat(action.amount) 
     }; 

當我deposit點擊我派遣depositIntoAccount行動，但我console.log(bankStore.getState().balance)現在Object {balance: null}

Answer 1

您在對象錯誤的動作發送。

this.props.onDeposit({ 
    amount: parseFloat(this.state.amount, 10) 
}); 

這應該是

this.props.onDeposit(parseFloat(this.state.amount, 10));