Реагировать на туземную реакцию на события в детской прессе - PullRequest
Новая
       7

Реагировать на туземную реакцию на события в детской прессе

0 голосов
/ 12 февраля 2020

Я ищу решение, которое позволило бы мне от родительского компонента реагировать на все дочерние события печати (включая дочерние, вложенные в другие компоненты). В частности, меня интересуют события пресс-релиза (например, onPressOut для TouchableOpacity и т. Д.).

Я не хочу прерывать реакцию ребенка на это событие, я хочу только дальше реагировать на это событие, выполнить какую-то другую задачу. По этой причине я не могу использовать фазу захвата на родительском компоненте, потому что он прекратит распространение события дальше в цепочке.

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

Родительский компонент TouchableOpacity позволяет мне на этапе всплывающих событий захватывать все события прессы, когда ни один дочерний элемент не отвечает на их. Но если ребенок отвечает на них, событие не распространяется дальше вверх по цепочке, поэтому оно никогда не достигнет родительского TouchableOpacity.

В коде: 

<TouchableOpacity onPressOut={ this.doSomethingInParentWhenAChildIsPressed >
    <TouchableOpacity onPressOut={()=>{
        /* doing something in child, parent should react in addition to this */
    } />
    <View>
        <TouchableOpacity onPressOut={()=>{
            /* doing something in nested child, parent should react in addition to this */
        } />
    </View>
    <View>
        <Text>When this text is pressed, the parent TouchableOpacity responds</Text>
        <View>
            <TouchableOpacity onPressOut={()=>{
                /* doing something in other nested child, parent should react in addition to this */
            } />
        </View>
        <View>
            <Text>The parent TouchableOpacity also responds on this text being pressed</Text>
        </View>
    </View>
</TouchableOpacity>

Знаете ли вы какого-либо способа достижения этого?

Можно ли каким-то образом захватить событие запуска касания от родителя, в то же время позволяя событию распространяться дальше в цепочке? Я искал что-нибудь, что позволило бы мне создать событие Syntheti c и создать его в React Native, но я не смог найти никакого решения.

1 Ответ

0 голосов
/ 12 февраля 2020

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

class App extends React.Component {
  onPress = () => {
    console.log('Parent Pressed');
  };
  render() {
    return (
      <View style={styles.container}>
        <TouchableHighlight onPress={this.onPress}>
          <View style={styles.button}>
            <Text>Parent</Text>
            <TouchableHighlight onPress={() => {
              console.log('Child Pressed')
              this.onPress()
            }} style={styles.child}>
              <Text>Child</Text>
            </TouchableHighlight>
          </View>
        </TouchableHighlight>
      </View>
    );
  }
}

оформить заказ, например https://snack.expo.io/@ashwith00 / 4ddff3

...