2017-02-17 6 views
1

TouchableHighlightとTouchableOpacityがレンダリング時に視覚的に反応する(onPressが呼び出されていない)動作が発生します。TouchableHighlightとTouchableOpacityがrender()でハイライト表示されます

1つのことは、私がページに入り、私のボタンが小さな「点滅」になるとちょっと変わったように見えることです。これは奇妙ですが、寛容です。より面倒なことは、親コンポーネントの状態を変更して再レンダリング()を呼び出すと、ボタンが再び「点滅」し、状態を変更するたびにすべてのボタンが点滅するということです。

ボタンを押すとページの状態が変わり、ボタンを押すと両方のボタンが「点滅」になります。

私はreact-reduxを使用しますが、これはこの動作に影響しません。

以下のコードは説明のためのものです。

render() 
{ 
    return(
     <View> 
      <ToucableHightlight> //Click here changes state 
       <Content/> 
      </ToucableHightlight> 
      <ToucableHightlight> //Click here changes state 
       <Content/> 
      </ToucableHightlight> 
     <View> 
    ); 
} 
+0

暗闇の中でだけでショットに再レンダリングトリガーのコードを入れていたが、誤ってそれを割り当てる 'onPress'代わりに呼び出していますか?例:onPress = {this._onPressStart} 'vs' onPress = {this._onPressStart()} ' – G0dsquad

+0

最初のレンダリング時にonPressが呼び出されるため、2番目の方法は使用できません。あなたは 'onPress = {()=> this._onPressStart()}' –

+0

を使用しなければなりません。 @ G0dsquad、もしあなたが 'this'にアクセスする必要があれば、どうすればいいですか? @WojtekSzafraniecこれはどちらでも修正されません。 – bloppit

答えて

0

私はこの問題を解決しました。以前私のレンダリング機能の中で私は "コンテンツ"コンポーネントを定義し、その結果、新しい(しかし同様の)コンポーネントが各アップデート中に定義されました。 「コンテンツ」の定義をレンダリング機能の外側に配置することで、ページが再レンダリングされたときにコンポーネントがもう点滅しなくなりました。

これは、親コンポーネントの各レンダリング時にコンポーネントが新しいコンポーネントとしてレンダリングされた理由を説明しますが、最初のレンダリングでTouchableHighlightが点滅する理由を説明しません。

初期レンダリング中にボタンが点滅しても問題ありません。どの状態変化でも点滅するボタンはありません。

私は今、十分満足しています。

0

私はそれ以降のバージョンを実行しているのかどうかはわかりませんが、この点滅の現象は最初のクリックでのみ発生することがわかりました。

私のソリューションは、setTimeoutを

  <TouchableOpacity 
      onPress={function() { 
       setTimeout(function() { 
       _this.setState({myState: 'someValue'}) 
       }); 
      }} 
      > 
関連する問題