Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Problem using dynamic data #41

Closed
jonathandion opened this issue Feb 28, 2017 · 4 comments
Closed

Problem using dynamic data #41

jonathandion opened this issue Feb 28, 2017 · 4 comments

Comments

@jonathandion
Copy link

jonathandion commented Feb 28, 2017

Hi,

When I use dynamic data I have an error undefined is not an object (evaluating 'this._positions[index].start') but when I use static data everything seem to work.

What I'm doing wrong ?

Thanks.

@bd-arc
Copy link
Contributor

bd-arc commented Feb 28, 2017

@jonathandion Hi,
This is probably the same issue as #35. There must be something wrong with component's state management. I'll look into it as soon as possible.

@jonathandion
Copy link
Author

jonathandion commented Feb 28, 2017

@bd-arc Hey Benoit,

Thanks sorry for the misunderstood. When I mean dynamic" I mean using data from my server using Ajax. When I use this.state.products I have that error.

this is working {this.renderProducts([{ title : "test"}, { title : "test" }])}
not {this.renderProducts(this.state.products)}

I fetch my products inside componentDidMount and set the state after receiving the data. The default state is this.state({ products: []}).

We really need to have data ?

@bd-arc
Copy link
Contributor

bd-arc commented Feb 28, 2017

@jonathandion I'll reproduce my answer to this issue :)

My guess is that you're trying to render the carousel while it has no child at all. Am I right? Indeed, this would fail since the component depends on children's length. We need to improve component's state management in order to handle this kind of usage.

For now, I would recommend you to render the carousel conditionally. Something along those lines:

get loader () {
    return (
        <ActivityIndicator size={'small'} />
    );
}

get carousel () {
    const { entries } = this.state;
    return (
        <Carousel>
            { entries }
        </Carousel>
    );
}

render () {
    const { products } = this.state;
    return !products.length ? this.loader : this.carousel;
}

Does this do the trick for you?

@jonathandion
Copy link
Author

@bd-arc thanks it's working 👍

@Exilz Exilz closed this as completed Mar 8, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants