react-native : onPress 不起作用

Posted 2023-04-18

【中文标题】react-native : onPress 不起作用

【英文标题】：react-native : onPress doesn't work

【发布时间】：2018-09-19 23:03:41

【问题描述】：

我在响应本机的 onPress 事件上工作。 第一次，我写了这段代码：

<TouchableOpacity
    onPress=(this.props.minimum==null||this.props.value-1>=this.props.minimum)
        ? this.props.onDecrement
        :console.log(this.props.texte+" : minimum atteint")
    style=[buttonSpinner,buttonSpinnerLeft]>

这样，我的按钮就可以工作了，但是 onPress 会在每次调用 render() 时自动调用。 我搜索并在这里找到了解决方案：React Native onPress being called automatically.

但是现在，如果我没有任何自动呼叫...当我按下我的 Touchable 组件时我没有呼叫。

我尝试了一些版本：

const p=this.props;
//some other code
<TouchableOpacity
    onPress=()=>(p.minimum==null||p.value-1>=p.minimum)
        ? p.onDecrement
        :console.log(p.texte+" : minimum atteint")
    style=[buttonSpinner,buttonSpinnerLeft]>

--

const p=this.props;
// some other code
<TouchableOpacity
    onPress=(p)=>(p.minimum==null||p.value-1>=p.minimum)
        ? p.onDecrement
        :console.log(p.texte+" : minimum atteint")
    style=[buttonSpinner,buttonSpinnerLeft]>

--

<TouchableOpacity
    onPress=()=>(this.props.minimum==null||this.props.value-1>=this.props.minimum)
        ? this.props.onDecrement
        :console.log(this.props.texte+" : minimum atteint")
    style=[buttonSpinner,buttonSpinnerLeft]>

没有成功...

精确，我在一个单独的组件上工作。这个组件在主渲染中被调用：

<NumberSpinner
    onDecrement = ()=>this.onDecrement(elt.idCat,idElt)
    onIncrement = ()=>this.onIncrement(elt.idCat,idElt)
    minimum = 0
    maximum = null
    texte = elt.slug
    value=elt.qteTxt
/>

【参考方案1】：

尝试将您的逻辑移动到函数中，因此请仅将 onPress 与函数调用一起使用

<TouchableOpacity
         onPress=this.onPress
       >
   <Text> Touch Here </Text>
</TouchableOpacity>

和你的功能：

onPress = () => 
   //your logic here
  

【讨论】：

那行不通。或者准确地说，我有 console.log 工作但没有功能不足。 onPressDecrement = () => ((this.props.minimum==null||this.props.value-1>=this.props.minimum) ? this.props.onDecrement :console.log(this.props.texte+" : 最小注意"));我正在编辑第一篇文章以准确说明上下文。

所以 onPress 工作正常，问题似乎出在你的 if 语句中。

if 语句在第一个版本（每个渲染中调用的那个）上正确工作

有效！在函数上使用此代码： onPressDecrement = () =>((this.props.minimum==null||this.props.value-1>=this.props.minimum) ? this.props.onDecrement() :console。 log(this.props.texte+" : minimum atteint"));

o.. 是的.. 调用函数:) 我也错过了:p。干得好。

【参考方案2】：

您需要从react-native 导入TouchableOpacity，而不是从react-native-gesture-handler 导入它。 react-native-gesture-handler 中的版本 100% 损坏。 react-native 中的版本有效。

接受的答案并不能解决这个问题。