Реактивигация с параметрами

Question

Я использую Реактивная навигация Я ищу способ передачи параметров в мой стек навигации следующим образом. У меня есть один экран, который я хочу использовать X раз. Ему нужен только URL и заголовок, и в зависимости от URL он должен делать то же самое для каждого URL.

Итак, я хочу создать объект примерно так:

const urls = {
  {title: 'foo', url: 'https://someurl'},
  {title: 'bar', url: 'https://someotherurl'}
}

А теперь в моем компоненте навигации я хотел бы сделать что-то вроде:

export default createMaterialTopTabNavigator({
 SomeKey: {
   // Loop here over the urls and create a component and pass props.
 }   
});

Моя проблема в том, что я не могу найти в документации, как передать параметры title и url через навигатор на определенные экраны.

Есть предложения?

Answer 1

Я делаю нечто подобное в своем приложении, но я беру свой массив из API и строю свою навигацию на этом. Для каждого элемента в моем массиве я строю одну и ту же настройку экрана в навигации по вкладкам, и все они доступны в навигаторе ящиков.

Вы могли бы сделать что-то вроде этого:

let NavigatorConfig = {};

urls.forEach(item => {
    NavigatorConfig = {
        ...NavigatorConfig,
        [item.title]: {
            screen: props => <MyComponent {...props} url={item.url} />
        }
    };
});

export default createMaterialTopTabNavigator(NavigatorConfig);

Answer 2

Я могу помочь вам с одной частью, вы можете передавать переменные из Навигатора, как это

export default createMaterialTopTabNavigator({
 ScreenOne: {
   screen:props=> <ScreenOne {...props} screenProps={yourpropsr}/>
 }   
});

В документации есть пример для StackNavigator, но я надеюсь, что это будет работать и для TabNavigator. Ссылка на документацию здесь