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

Actions.refresh not working #2518

Closed
sitompul opened this issue Oct 18, 2017 · 24 comments
Closed

Actions.refresh not working #2518

sitompul opened this issue Oct 18, 2017 · 24 comments

Comments

@sitompul
Copy link

sitompul commented Oct 18, 2017

Version

Tell us which versions you are using:

  • react-native-router-flux v4.0.0-beta.12
  • react-native v0.46.4

Expected behaviour

Actions.refresh() refresh the current scene.
If my approach was wrong, or Actions.refresh has some requirement, please provide me with the information

Actual behaviour

const ConnectRouter = connect()(Router);

const Routes = () => (
  <ConnectRouter>
    <Scene key="root">
      <Scene key="launchScreen" component={LoadingFull} hideNavBar />
      <Scene key="login" component={LoginForm} hideNavBar type={ActionConst.RESET} />
      <Scene key="lostPassword" component={LostPasswordForm} hideNavBar />
      <Scene key="dashboard" component={Dashboard} hideNavBar type={ActionConst.RESET} />
      <Scene key="search" component={SearchResult} hideNavBar />
    </Scene>
  </ConnectRouter>
);

When i was at search scene (plain component with state), i was trying to refresh the scene by using Actions.refresh. But somehow it didn't work at all.

Steps to reproduce

  1. Using provided scene list go to search Component (it was just plain component with state)
  2. trigger actions.refresh by pressing button/ triggering some event
@omeraplak
Copy link

omeraplak commented Oct 24, 2017

+1
i want to use renderBackButton from scene. My example code,

public componentWillMount (): void {
               Actions.refresh({
			renderBackButton: this.renderBackButton.bind(this),
			onRight: this.onRightButtonPress.bind(this)
		});
}

It's not working. I think it's same issue.

@kesha-antonov
Copy link
Contributor

Try leftButton instead of renderBackButton and pass Component to it.

@omeraplak
Copy link

omeraplak commented Oct 24, 2017

@kesha-antonov It's not working. I create new issue for this.

@kesha-antonov
Copy link
Contributor

It works for me. rnrf-4-beta22

leftButton for left icon
right for right icon

@peterchen08
Copy link

public componentWillMount (): void {
this.props.navigation.setParams({
onRight: () => {this.myOnRight();},
rightTitle:'newTitle',
});
}
It working for me.

@francois-pasquier
Copy link

Jesus, I came here looking for an answer for the original issue.
Please, try not to piggyback on non related issues !

@frangeris
Copy link

frangeris commented Nov 24, 2017

I'm having the same issue BUT when updating the store (mobx)

@observer
class Custom extends Component {
  render() {

    // prints every time I update state, this's ok!
    console.log('update', store.session.get('logged'))

    return (
      <Router>
        <Scene key="root">
          <Scene key="login"
            component={login}
            type="replace"
            onEnter={() => {
                // ONLY enter here once
                console.log('onEnter');
                return store.session.get('logged')
            }}
            success="recents"
          />
          <Scene key="recents" component={recents} />
        </Scene>
      </Router>
    )
  }
}

I tried to trigger the 're-render' calling Actions.refresh() after the update of the store, but onEnter is not responding.

  _onPressButton() {
    store.session.set('logged', !store.session.get('logged')) // invert the value in store
    Actions.refresh() // tested with { key: 'login' } too
  }

issue

@aksonov Could you please point us to the right direction? 🙏

@Alp4ga
Copy link

Alp4ga commented Dec 13, 2017

Hi

I have the same problem ... When i try to refresh with Actions.refresh() nothing happen

import React, { Component } from 'react';
import {
    View,
    Text,
    Button,
} from 'react-native';

import { Actions } from 'react-native-router-flux';

export default class Types extends Component {

    constructor(props) {
        super(props);
        console.log("Constructor Types")
    }

    componentWillMount() {
        console.log('Will mount Types')
    }

    componentWillUpdate() {
        console.log("Will Update Types")
    }

    componentWillUnmount() {
        console.log("will Unmont Types")
    }
    render() {
        console.log("render Types")
        return (
            <Button title='refresh' onPress={() => Actions.refresh()}/>
        )
    }
}

@mlevkovsky
Copy link

same issue here, I am using redux and when I try to refresh the right button it just doesn't update.

@aksonov
Copy link
Owner

aksonov commented Jan 5, 2018

Please reproduce the issue with Example project.

@jaysassyinfotech
Copy link

jaysassyinfotech commented Feb 8, 2018

Actions.refresh({ key: Actions.currentScene }); not working second time
#2862
@aksonov

@cosinus84
Copy link

cosinus84 commented Mar 15, 2018

@jaysassyinfotech
Actions.refresh({ key: Actions.currentScene }); not working second time
It works if you do like this :)
Actions.refresh({key: Math.random()})

@katiachumakova
Copy link

@cosinus84 You sir are a lifesaver.

@kevinkjs
Copy link

@cosinus84 It is really work. wow
But is there any explaination why Math.random() does all the tricks?

@hanishcodebrew
Copy link

@cosinus84 you rock man (y)

@aksonov aksonov closed this as completed Aug 8, 2018
@aksonov
Copy link
Owner

aksonov commented Aug 8, 2018

Hopefully random is not needed for latest version now

@SalviShahzad
Copy link

@aksonov Please can you list down the props (with their functions ) that we can use in Actions.refresh() as the Scene props don't seem to be working here.

@aksonov
Copy link
Owner

aksonov commented Oct 23, 2018

You may check Example app and its refresh calls - it works fine there with latest 4.0.5. Feel free to clone and modify example accordingly to demonstrate the issue.

@SalviShahzad
Copy link

Yes, it is working fine but I suggest you to make a list of props to be used with refresh calls as we may not know which one to use when.
For example to render the back button we need to use leftButton prop but I did not know that until I read the comment of @kesha-antonov

@preetluv
Copy link

its working

@C0dekid
Copy link

C0dekid commented Mar 11, 2019

@preetluv mind telling me how you fixed it?

@waliurjs
Copy link

@preetluv see cosinus84's answer

@christopher-18
Copy link

you can do following:-

Actions.pop()
setTimeout(()=> Actions.refresh({"somePropToRefresh":Math.random(),"yourProp":"to refresh the
previous screen on going back"}),0.5);

You can check the "yourProp" in componentWillReceiveProps in previus screen after doing back.

@matteocollina
Copy link

I use react-native-router-flux 4.2.0-beta.2 and it works with setTimeout

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

No branches or pull requests