Problem passing props into React component from createContainer


#1

I have a really annoying issue and can’t understand why it’s happening. I have the following container:

export default SomeContainer = createContainer(( params ) => {

    const handle1 = Meteor.subscribe('SomePub');
    const isReady1 = handle1.ready();

    var someData = [];
    if( isReady1 ){
         someData = SomeColl.find({}).fetch();
    }

    console.log(someData);

    return {
        someData: someData
    };

}, SomeComponent);

Here is the component:

export class SomeComponent extends Component {
    constructor(props) {
        super(props);
        console.log(this.props);
    }
};

When I console.log the contents of someData from with the container, it contains some data. However, when I check for someData in the props of the component, it just shows someData as an empty array.

Anyone know what’s going on?


#2

Try this:

export class SomeComponent extends Component {
  constructor(props) {
    super(props);
    console.log(this.props);
  }

  componentWillReceiveProps(newProps) {
    console.log(newProps);
  }
};

SomeComponent is only constructed once with your initial value of someData, which is an empty array. When someData is fully loaded in your container and passed back into your component, it doesn’t run through the constructor again - you can see this by logging the incoming props via the componentWillReceiveProps lifecycle method.


#3

What a plonker I am today :slight_smile: Many thanks :slight_smile: