Is it possible to hide a particular tab in TabBar from inside a scene?

[dragfire]

I have 5 Tabs in TabBar and I would like to manipulate them from inside a Scene.
Is it possible to manipulate them using Actions.refresh?

[ArtemX9]

@dragfire You have to write your own action and dispatch it. You also need to add action handling in you custom reducer.

[dragfire]

Do I have to use redux/flux for this? https://github.com/aksonov/react-native-router-flux/blob/master/docs/REDUX_FLUX.md#reduxflux

[ArtemX9]

You can import Reducer from react-native-router-flux, and implement it like this:

const reducerCreate = params => {
  const defaultReducer = new Reducer(params);
  return (state, action) => {
    switch (action.type) {
      case '*YOUR_ACTION_NAME*':
        ....manipulations with the state here....
        return state;
      default:
        return defaultReducer(state, action);
    }
  };
};

and then call it this way:

ACTIONS.*YOUR_SCENE_NAME*({ type: '*YOUR_ACTION_NAME*' });

[dragfire]

Thank you @ArtemX9

[dragfire]

@ArtemX9 I've implemented the reducer as you suggested. Everything is working as I want but there is a warning: Component's children should not be mutated being thrown in the console.

Here's my custom reducer:

const reducerCreate = params => {
    const defaultReducer = new Reducer(params);
    return (state, action) => {

        switch (action.type) {
            case CustomActions.REMOVE_TWO_TABS:

                let childrens = state.children;
                childrens[1].children.splice(1, 2);
                console.log('CHILDRENS:', childrens);
                return Object.assign({}, state, childrens);
            default:
                return defaultReducer(state, action);
        }
    };
};

Is it a false-positive or am I doing something wrong?

[ArtemX9]

@dragfire try to clone state.children before splicing, because splice mutates the original array. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice

[dragfire]

Ok thanks!

[hoangdoan267]

@dragfire I always have an error at const defaultReducer = new Reducer(params);
it said undefined is not an object (evaluating ' _ref3.initialState) ?

P/s: I want to change Tabbar title when pressing a button

import { Reducer } from 'react-native-router-flux'
const initialState = {
  tabStatus: "VN"
}
const routerReducer = params => {
  const defaultReducer = new Reducer(params)
  return (state, action) => {
    switch (action.type) {
      case 'CHANGE_LANGE':
        return {
          ...state,
          tabStatus: "EN"
        }
        break;
      default:
         return defaultReducer(state, action);
    }
  }
}

export default routerReducer