TouchableOpacity проглатывает событие касания и никогда не проходит

Я пытаюсь сделать так, чтобы onPress произошло TouchableOpacity, но срабатывает только второй:

<TouchableOpacity onPress={() => console.warn('first button')}>
  <TouchableOpacity onPress={() => console.warn('second button')}>
    <Text>
      PRESS ME
    </Text>
  </TouchableOpacity>
</TouchableOpacity>

Как я могу заставить их обоих гореть?

Заранее спасибо!


person gran33    schedule 13.11.2016    source источник
comment
Я не думаю, что вы можете это сделать — система сенсорного респондента в React Native работает не так. Может быть, вы могли бы описать, почему вы пытаетесь это сделать и чего вы пытаетесь достичь, и может быть лучшее решение?   -  person jevakallio    schedule 13.11.2016
comment
Если ваш вариант использования настолько прост, почему бы вам не объединить ваши 2 TouchableOpacity в один?   -  person milkersarac    schedule 08.12.2016


Ответы (1)


Вы можете запустить оба из них, просто используя концепцию «ref» и вызывая реквизиты onPress.

<TouchableOpacity onPress={() => 
  AlertIOS.alert('firstbutton')
  } 
  ref={component => this.myFirstTouchable = component}
>
    <TouchableOpacity onPress={() => 
        {
        AlertIOS.alert('second')
        this.myFirstTouchable.props.onPress()
        }
    }>
        <Text>
          PRESS ME
        </Text>
      </TouchableOpacity>
    </TouchableOpacity>
person Crash    schedule 13.11.2016
comment
Спасибо, но я предпочитаю НЕ использовать ref, это не одна из лучших практик, и ее следует использовать только в том случае, если нет других решений. - person gran33; 13.11.2016
comment
На самом деле вы просите что-то, чего вам следует избегать в приложении (2 сенсорных элемента в одном и том же месте, выполняющих 2 разных действия). - person Crash; 13.11.2016
comment
реф это не плохая практика! Доступ к ref через this.refs.myString не является доступом к элементу через обратный вызов ref. Существует множество библиотек, использующих обратный вызов ref. Даже сам RN... (взгляните на пример UIExplorer) Из документации React: Использование обратного вызова ref только для установки свойства класса является распространенным шаблоном для доступа к элементам DOM. Если вы в настоящее время используете this.refs.myRefName для доступа к ссылкам, мы рекомендуем вместо этого использовать этот шаблон. - person Crash; 13.11.2016