StillDead
StillDead

Reputation: 2079

Why is React asking for repeated props in static propTypes?

After running the test of my code, React says that there some props missing. So at the end I have this

  static propTypes = {
    'payoutInfo'                    : React.PropTypes.object,
    'payoutInfo.sideBetPayouts'     : React.PropTypes.arr,
    'payoutInfo.sideBetPayouts.map' : React.PropTypes.func,
  }

let me show you where the code comes from

here is the action. (I am using Flux)

class PayoutLimitActions {

  constructor () {
    this.generateActions('payoutsInfo');
  }

  payoutsInfo (payoutArray) {
    this.actions.payoutsInfo(payoutArray);
    this.dispatch();
  }
}

export default PayoutLimitActions;

here is the store

import PayoutLimitActions from 'actions/PayoutLimitActions';

@createStore(flux)
class PayoutLimitStore {

  constructor () {
    this.state = {
      payoutProp : localStorage.getItem('payoutArray') ? JSON.parse(localStorage.getItem('payoutArray')) : [],
    };
  }

  @bind(PayoutLimitActions.payoutsInfo)
  payoutsInfo (payoutArray) {
    this.setState({
      payoutProp : payoutArray,
    });
    localStorage.setItem('payoutArray', JSON.stringify(payoutArray));
  }
}

export default PayoutLimitStore;

here I have an AuthStore where I am using the PayoutLimitActions

axios.post(`${API_ENDPOINT}`, credentials)
  .then( (response) => {
    PayoutLimitActions.payoutsInfo(response.data.lobbyData);
    this.actions.authSuccess({...response.data, ...credentials});
  })

here the component

  <TableLimitsTooltip {...{
    payoutProp : this.props.payoutProp,
  }} />

so, why that would be happening ?

Upvotes: 0

Views: 179

Answers (1)

gcedo
gcedo

Reputation: 4931

It would be more useful to see the component code, not its use, to better understand what props you are actually using inside and how they are called.

Anyway, there is a mistake in the way you define types for an object. You must use the shape type.

static propTypes = {
  payoutInfo: React.PropTypes.shape({
    sideBetPayouts: React.PropTypes.array
  })
}

Also, be aware that

  • The PropType for an Array is PropTypes.array
  • There is no need to define the PropTypes for the Array.prototype.map method

Upvotes: 1

Related Questions