0

I'm trying to add onLeft for a scene employeeEdit scene when returning from the scene should the user not wish to make changes to the current selected employee that they'll be able to return to the employee list and the fields will be emptied when going onto Add by using type: 'reset' as if were to save changes.

It seems that the onLeft is not working in this case here in that the function is not actually being executed. 

<Router sceneStyle={{ paddingTop: 65 }}>
    <Scene key="auth">
        <Scene key="login" component={LoginForm} title="Please Login" initial />
    </Scene>

    <Scene key="main">
        <Scene 
            onRight={() => Actions.employeeCreate()}
            rightTitle="Add"
            key="employeeList" 
            component={EmployeeList} 
            title="Employees" 
            initial
        />
        <Scene
            key="employeeCreate" 
            component={EmployeeCreate} 
            title="Create Employee" 
        />
        <Scene
            onLeft={() => Actions.employeeList({ type: 'reset' })}
            key="employeeEdit" 
            component={EmployeeEdit} 
            title="Edit Employee" 
        />                
    </Scene>
</Router>
Michael
  • 591
  • 8
  • 24
  • Are you getting any errors? Where is the employeeList function? – Adam Patterson Mar 30 '17 at 12:10
  • HI @AdamPatterson, there are no errors. It seems that nothing in onLeft is called not even a console.log, leftTitle cannot be set etc. Looking in the console log there are no errors, anything on the right works but on the left it does not. Apply any of the following for the navigation-bar-left-button to a nested scene do not appear to work. https://github.com/aksonov/react-native-router-flux/blob/master/docs/API_CONFIGURATION.md#navigation-bar-left-button Thanks again! – Michael Mar 30 '17 at 19:49
  • Would `Actions.pop()` solve your problem? – Adam Patterson Mar 30 '17 at 19:53
  • It seems that the onLeft is not working for me, where would you suggest placing Actions.pop()? Thanks – Michael Mar 30 '17 at 19:56
  • I am not sure. I feel like I need to see more of your code to understand what could be happening. I am not sure Actions.pop() will let you pass properties, but you might be able to replace `Actions.employeeList({ type: 'reset' })` with `Actions.pop()` to go backwards. – Adam Patterson Mar 30 '17 at 20:17
  • Yeah, I'm not sure because onLeft is not being invoked at all whatever the function. onLeft only seems to work on the 1st scene in key of main i.e. having key employeeList. A workaround for this is to use componentWillUnmount on the component employeeEdit which is a bit longer as expected. – Michael Apr 02 '17 at 03:22

1 Answers1

1

A longer approach.

Using componentWillUnmount, this is effective when leaving the component i.e. EmployeeEdit 

componentWillUnmount () {
    this.props.employeeInitial();
}

and this can then call a prop of gigInitial; having an action which will return a dispatch say of type: 'EMPLOYEE_INITIAL'

export const employeeInitial = () => {
    return (dispatch) => {
        dispatch({ type: EMPLOYEE_INITIAL });
    };
};

which at the EmployeeFormReducer will then just return INITIAL_STATE

case EMPLOYEE_INITIAL:
    return INITIAL_STATE;
Michael
  • 591
  • 8
  • 24
  • I tried all the options according to the API that I thought would control the left header button but none of them worked for me either. Were you able to find another solution? – Hatem Jaber Oct 15 '17 at 15:35