Зачем нужен this.props.componentId? - PullRequest
Новая
       12

Зачем нужен this.props.componentId?

2 голосов
/ 27 мая 2019

Зачем нужен this.props.componentId?

Какова его цель?

Почему мы не можем использовать библиотеку без этого идентификатора?

react-navigationне нужно что-то подобное, и react-native-navigation v1 не использовал ничего подобного.Так почему v2 нуждается и использует это?Причина, по которой я прошу, это, во-первых, понять это, а во-вторых, посмотреть, смогу ли я пропустить это, поскольку теперь я не могу использовать RNN v2 из саги.

1 Ответ

0 голосов
/ 30 мая 2019

Вот подробный ответ из blogpost библиотеки react-native-navigation developer .

Итак, теперь мы хотим включить следующее поведение: послепользователь нажимает на текст, приложение нажимает на экран ViewPost.Позже будет очень легко прикрепить ту же функцию к элементу списка вместо текста.Чтобы вставить новый экран в стек навигации этого экрана, мы будем использовать Navigation.push. В новом API этот метод ожидает получения текущего componentId, который можно найти в props.componentID .Поэтому в PostsList.js мы создаем функцию pushViewPostScreen и присоединяем ее к событию onPress текста. 

import React, {PureComponent} from 'react';
import {View, Text} from 'react-native-ui-lib';
import PropTypes from 'prop-types';
import {Navigation} from 'react-native-navigation';

class PostsList extends PureComponent {

  static propTypes = {
    navigator: PropTypes.object,
    componentId: PropTypes.string
  };

  constructor(props) {
    super(props);

    this.pushViewPostScreen = this.pushViewPostScreen.bind(this);
  }

  pushViewPostScreen() {
    // We pass the componentId to Navigation.push
    // to reference the which component will be pushed
    // to the navigation stack

    Navigation.push(this.props.componentId, {
      component: {
        name: 'blog.ViewPost',
        passProps: {
          text: 'Some props that we are passing'
        },
        options: {
          topBar: {
            title: {
              text: 'Post1'
            }
          }
        }
      }
    });
  }



  render() {
    return (
      <View flex center bg-blue60>
        <Text onPress={this.pushViewPostScreen}>Posts List Screen</Text>
      </View>
    );
  }
}

export default PostsList;

В официальных документах кажется, что Screen API, отвечающий за нажатие, нажатие и изменение навигации, будет доступно через *Модуль 1025 * всегда ожидает, что props.componentId получит ссылку на компонент.

...