How can I change the reflux listenTo mixin based on a prop in a react.js component

Question

Can anyone help with this...

I have this list component and I want to be able to switch different data stores (defined in props)

mixins:[Reflux.listenTo(RecentPupilsStore, 'onChange')],

But I want to do this -

mixins:[Reflux.listenTo(this.props.store, 'onChange')],

But props don't appear to be available in the mixin. I also tried to transfer it to a function:

mixins:[Reflux.listenTo(this.setStore(this.props.store), 'onChange')],
setStore: function(store){
    if(store == 'RecentPupilsStore') { return RecentPupilsStore; }
},

Any help appreciated. pretty new ot react but trying to make it as reusable as possible!

EG: I want to include the component like this:

<FilterList data="pupils" />
<FilterList data="groups" />

etc - and these would look at these stores.

Answer 1

I would pass on using the mixin and just listen to both stores and map your data accordingly.

componentDidMount = () => {
    // console.log('AppCtrl componentDidMount');
    this.unsubscribeApp = AppStore.listen(this.appStoreDidChange);
    this.unsubscribeGS = GenusSpeciesStore.listen(this.gsStoreDidChange);
};
componentWillUnmount = () => {
    this.unsubscribeApp();
    this.unsubscribeGS();
};
appStoreDidChange = () => {
    this.setState(getAppState());
};
gsStoreDidChange = () => {
    this.setState(getGsState());
};