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

When DayPickerInput get new props, it doesn't change its state #363

Closed
youreme opened this Issue May 25, 2017 · 7 comments

Comments

4 participants
@youreme

youreme commented May 25, 2017

Hi,

When DayPickerInput gets nextProps, it doesn't change its states.
How about adding componentWillReceiveProps lifecycles?

After it mounted,
if it doesn't trigger any change events, the value state is different from value property.

DayPickerInput

componentWillReceiveProps(nextProps) {
  this.state = getStateFromProps(nextProps);
}
@infomiho

This comment has been minimized.

Show comment
Hide comment
@infomiho

infomiho commented May 25, 2017

+1

@gpbl

This comment has been minimized.

Show comment
Hide comment
@gpbl

gpbl May 25, 2017

Owner

Thinking about the use case here. Just resetting the state when the component receives new props doesn't work because the method it is always called when re-rendering the component. So we should add a condition there, like:

componentWillReceiveProps(nextProps) {
  if (nextProps.value !== this.state.value) {
    this.setState(getStateFromProps(nextProps));
  }
}

however this will cause the overlay to flicker (hide/show) when passing a value from the parent component, e.g. in this example. A similar issue would appear if the entered value is empty hence I'd use

if (nextProps.value && nextProps.value !== this.state.value) {

but I'm not sure if this would cover the common use cases 🤔

Owner

gpbl commented May 25, 2017

Thinking about the use case here. Just resetting the state when the component receives new props doesn't work because the method it is always called when re-rendering the component. So we should add a condition there, like:

componentWillReceiveProps(nextProps) {
  if (nextProps.value !== this.state.value) {
    this.setState(getStateFromProps(nextProps));
  }
}

however this will cause the overlay to flicker (hide/show) when passing a value from the parent component, e.g. in this example. A similar issue would appear if the entered value is empty hence I'd use

if (nextProps.value && nextProps.value !== this.state.value) {

but I'm not sure if this would cover the common use cases 🤔

@gpbl gpbl changed the title from When DayPickerInput get nextProps, it doesn't change states. to When DayPickerInput get new props, it doesn't change its state May 25, 2017

@spmebrge

This comment has been minimized.

Show comment
Hide comment
@spmebrge

spmebrge May 25, 2017

+1 experiencing same issue

spmebrge commented May 25, 2017

+1 experiencing same issue

@gpbl gpbl closed this in #365 May 25, 2017

@gpbl

This comment has been minimized.

Show comment
Hide comment
@gpbl

gpbl May 25, 2017

Owner

Thanks people for the report, the bug should have been fixed in v5.5.2

Owner

gpbl commented May 25, 2017

Thanks people for the report, the bug should have been fixed in v5.5.2

@youreme

This comment has been minimized.

Show comment
Hide comment
@youreme

youreme May 26, 2017

Hi~ thanks for update~!
it works well~

I have a question about componentDidMount.
why do you set state directly not using "setState" method?

thanks.

youreme commented May 26, 2017

Hi~ thanks for update~!
it works well~

I have a question about componentDidMount.
why do you set state directly not using "setState" method?

thanks.

@gpbl

This comment has been minimized.

Show comment
Hide comment
@gpbl

gpbl May 26, 2017

Owner

@youreme are you talking about the constructor? https://stackoverflow.com/questions/34961853

Owner

gpbl commented May 26, 2017

@youreme are you talking about the constructor? https://stackoverflow.com/questions/34961853

@youreme

This comment has been minimized.

Show comment
Hide comment
@youreme

youreme May 28, 2017

@gpbl yes, constructor^^; Thanks for kindly information~

youreme commented May 28, 2017

@gpbl yes, constructor^^; Thanks for kindly information~

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment