2015-10-11 18 views
10

अक्षम कर रहा है मैं मूल निवासी प्रतिक्रिया करने के लिए नया हूं, इसलिए शायद कुछ बहुत स्पष्ट पूछ रहा हूं, लेकिन कृपया मदद करें।प्रतिक्रिया मूल टच करने योग्य स्क्रॉलव्यू

मेरे पास टच करने योग्य दृश्य है, ताकि पूरा क्षेत्र टैप करने का जवाब दे। फिर दृश्य के अंदर घोंसला एक स्क्रॉल व्यू है। समग्र संरचना कुछ इस तरह है:

<TouchableWithoutFeedback onPress={this.handlePress.bind(this)}> 
    <View> 
     <ScrollView> 
      <Text>Hello, here is a very long text that needs scrolling.</Text> 
     <ScrollView> 
    </View> 
</TouchableWithoutFeedback> 

जब यह संकलित करता है तथा रन, दोहन का पता चला है, लेकिन पुस्तक दृश्य बिल्कुल स्क्रॉल नहीं करता है। मैंने उपर्युक्त कोड को छोटा और सरल बना दिया है, लेकिन प्रत्येक घटक में उचित स्टाइल है और मैं सबकुछ ठीक से प्रस्तुत कर सकता हूं और स्क्रॉलव्यू के निचले हिस्से में लंबा टेक्स्ट कटऑफ है। कृपया मदद करे।

धन्यवाद!

+0

एक स्पर्श करने योग्य तत्व के अंदर स्क्रॉलव्यू क्यों है? इसे बाहर क्यों न रखें? – mutp

+1

इसे आज़माएं: false} /> –

+0

सुनिश्चित नहीं है कि आप क्या करने की कोशिश कर रहे हैं लेकिन https://facebook.github.io/react-native/ मेंShouldBlockNativeResponder पर एक नज़र डालें देशी इशारा हैंडलिंग को अवरुद्ध न करने के लिए दस्तावेज़/panresponder.html। –

उत्तर

-1

Thats लिखते हैं, आपके पास टच करने योग्य WithoutFeedback के अंदर एक स्क्रॉल दृश्य नहीं हो सकता है, यह प्रतिक्रियाशील मूल की संपत्ति है कि यह इसे अक्षम कर देगा, इसके बजाय आप टच करने योग्य WithoutFeedback टैब के बाहर अपना स्क्रॉल व्यू कर सकते हैं और अन्य सामग्री जो आप चाहते हैं एक व्यू टैग के अंदर क्लिक करें।

यदि आप TouchableWithoutFeedback काम नहीं करता है तो आप इसके बजाय टच करने योग्य हाइलाइट्स का भी उपयोग कर सकते हैं।

+0

आपके पास टच करने योग्य के भीतर स्क्रॉलव्यू हो सकता है, समाधान देखें - https://stackoverflow.com/a/46606223/1828637 – Noitidart

-1

मुझे लगता है कि स्क्रॉलव्यू का उपयोग आपके कोड में अच्छा नहीं है। आप के रूप

<View> 
    <ScrollView> 
     <TouchableX> 
     <View> 
      <Text></Text> 
     </View> 
     </TouchableX> 

    </ScrollView> 
</View> 
+0

आपके पास टच करने योग्य के भीतर स्क्रॉलव्यू हो सकता है, समाधान देखें - https://stackoverflow.com/a/46606223/1828637 – Noitidart

3

एक दृश्य के अंदर scrollview लपेट कर सकते हैं आप एक TouchableWithoutFeedback अंदर एक scrollview या FlatList हो सकता है। आपको नहीं करना चाहिए लेकिन कुछ बार आपके पास जाने का कोई और विकल्प नहीं है। इस प्रश्न पर एक अच्छा नज़र डालने और जवाब उस को मान्य करता है। close react native modal by clicking on overlay, how to dismiss modal by tapping screen in react native

प्रश्न के लिए

, एक ही रास्ता आप यह काम (कम से कम है कि मैं के बारे में पता है), या सबसे आसान तरीका है इस तरह अपने कोड में पाठ के चारों ओर एक TouchableOpacity जोड़ना है बना सकते हैं,

<TouchableWithoutFeedback onPress={this.handlePress.bind(this)}> 
    <View> 
     <ScrollView> 
      <TouchableOpacity> 
      <Text>Hello, here is a very long text that needs scrolling.</Text> 
      </TouchableOpacity> 
     <ScrollView> 
    </View> 
</TouchableWithoutFeedback> 

नोट: टच करने योग्य ओपेसिटी स्पर्श करने के लिए सही तरीके से प्रतिक्रिया देने के लिए एक रैपर है, इसलिए आप इसे अपने दृश्य घटक को स्टाइल करने के तरीके को स्टाइल कर सकते हैं, फिर अपने कुछ विशेष प्रोप को सेट करें जो आप चाहते हैं जैसे सक्रिय एपैसिटी इत्यादि। मोर्सो आप टच करने योग्य हाइलाइट का उपयोग कर सकते हैं, लेकिन यह काम करता है, लेकिन यह एक बच्चे तत्व प्राप्त करता है यानी आप अपने सभी घटक को माता-पिता के अंदर संलग्न करते हैं।

2
I'm using this structure it's working for me: 

<TouchableWithoutFeedback onPress={() => {}}> 
    {other content} 
    <View onStartShouldSetResponder={() => true}> 
     <ScrollView> 
      {scrollable content} 
     </ScrollView> 
    </View> 
</TouchableWithoutFeedback> 
+0

यह सही उत्तर है। धन्यवाद!!!! – Noitidart

संबंधित मुद्दे