React-native-router-flux: मोडल का उपयोग कैसे करें

को निर्मित 3 अग॰ 2017 · 16टिप्पणियाँ · स्रोत: aksonov/react-native-router-flux

संस्करण

प्रतिक्रिया-देशी-राउटर-फ्लक्स v4b15
प्रतिक्रिया देशी v46

मैं वास्तव में मॉडलों के साथ संघर्ष कर रहा हूं क्योंकि उन पर कोई दस्तावेज नहीं है और उदाहरण में कोई टिप्पणी या संकेत नहीं है कि कुछ दृश्यों को सामान्य रूप से कैसे प्रदर्शित किया जाता है और अन्य नहीं। यहाँ मेरा कोड है।

<Router>
  <Scene key="root" hideNavBar hideTabBar>
    <Scene key="tabBar" tabs>
      <Scene key="listings" component={Listings} title="Listings" initial right={MapButton} />
      <Scene key="favorites" component={Favorites} title="Favorites" />
      <Scene key="messages" component={Messages} title="Messages" />
      <Scene key="profile" component={Profile} title="Profile" />
    </Scene>
    <Scene key="modal" modal>
      <Scene key="map" component={Map} title="Map" hideNavBar />
    </Scene>
    <Scene key="listingDetail" component={ListingDetail} title="Listing Detail" clone />
  </Scene>
</Router>;

मैं मानचित्र घटक को सामान्य रूप से प्रदर्शित करने का प्रयास कर रहा हूं।

MapButton निम्नलिखित है:

const MapButton = () =>
  <TouchableWithoutFeedback onPress={Actions.map}>
    <Text>Map</Text>
  </TouchableWithoutFeedback>;

मुझे इसका उपयोग करना है क्योंकि राइटटेक्स्ट बेहद छोटी है और आधा समय प्रस्तुत नहीं करेगा।

स्रोत

danieljvdm

👍4

सबसे उपयोगी टिप्पणी

धन्यवाद, यह इस मुद्दे को ठीक करता है। जब आप इसके बारे में दस्तावेज़ीकरण की कोई पंक्ति नहीं रखते हैं, तो आप मुझसे कुछ समझने की उम्मीद कैसे कर सकते हैं? इस मोडल फीचर के बारे में कई लोगों ने मुद्दे खोले हैं, हो सकता है कि यह डॉक्स की आवश्यकता का संकेत हो ...

danieljvdm 3 अग॰ 2017

👍44 😄1

सभी 16 टिप्पणियाँ

अपने root दृश्य को मोडल के अंदर रखने का प्रयास करें।
ऐशे ही:

<Router>
    <Scene key="modal" modal>
       <Scene key="root" hideNavBar hideTabBar>
            <Scene key="tabBar" tabs>
              <Scene key="listings" component={Listings} title="Listings" initial right={MapButton} />
              <Scene key="favorites" component={Favorites} title="Favorites" />
              <Scene key="messages" component={Messages} title="Messages" />
              <Scene key="profile" component={Profile} title="Profile" />
            </Scene>
        </Scene>
        <Scene key="map" component={Map} title="Map" hideNavBar />

luco 3 अग॰ 2017

आपको रूट सीन को modal के रूप में बनाना चाहिए जैसे @luco ने सुझाव दिया था। कृपया उदाहरण परियोजना की जाँच करें, लॉगिन को मोडल के रूप में लागू किया गया है

aksonov 3 अग॰ 2017

यह अभी भी काम नहीं करता है।

<Router>
    <Scene key="modal" modal>
      <Scene key="root" hideNavBar hideTabBar>
        <Scene key="tabBar" tabs>
          <Scene key="listings" component={Listings} title="Listings" initial right={MapButton} />
          <Scene key="favorites" component={Favorites} title="Favorites" />
          <Scene key="messages" component={Messages} title="Messages" />
          <Scene key="profile" component={Profile} title="Profile" />
        </Scene>
        <Scene key="map" component={Map} title="Map" hideNavBar />
        <Scene key="listingDetail" component={ListingDetail} title="Listing Detail" clone />
      </Scene>
    </Scene>
  </Router>

मेरे लिए इसका कोई मतलब नहीं है कि मोडल सीन में सब कुछ लपेटने से एक विशिष्ट दृश्य मोडल बन जाएगा जब मैं नहीं चाहता कि बाकी (जैसे लिस्टिंगडिटेल) मोडल हो। क्या Actions.map में कोई विशिष्ट पैरामीटर है जिसका मुझे उपयोग करने की आवश्यकता है?

danieljvdm 3 अग॰ 2017

👍6

दुर्भाग्य से यह प्रतिक्रिया-नेविगेशन की समस्या है - यह ढेर बच्चों के लिए विभिन्न एनिमेशन का समर्थन नहीं करता है। मैं आपकी समस्या का पुनरुत्पादन नहीं कर सकता (कोड ठीक दिखता है), यही कारण है कि मैं हर किसी को इस रेपो उदाहरण को फोर्क और संशोधित करने के लिए कहता हूं यदि वे चाहते हैं कि उनकी समस्याएं हल हो जाएं। उदाहरण से लॉगिन मोडल ठीक काम करता है जैसा कि आप देख सकते हैं

aksonov 3 अग॰ 2017

तो क्या आप कह रहे हैं कि मोडल आईओएस ट्रांजिशन को सपोर्ट करने का कोई तरीका नहीं है? यानी वह जो नीचे से फिसलता है?

danieljvdm 3 अग॰ 2017

आपका क्या मतलब है? मैंने आपको दो बार कहा था कि उदाहरण में मोडल लॉगिन स्क्रीन है (जो नीचे से स्लाइड करती है)

aksonov 3 अग॰ 2017

ठीक है, लेकिन आपने यह भी कहा कि मेरा कोड ठीक दिखता है ....

danieljvdm 3 अग॰ 2017

मैंने उदाहरण का पालन करने की पूरी कोशिश की है, लेकिन कोई दस्तावेज नहीं होने के कारण मैं यह नहीं बता सकता कि सब कुछ होने का कारण क्या है। मैं उस कोड को कॉपी और पेस्ट नहीं कर सकता क्योंकि जाहिर तौर पर मेरे मार्ग अलग हैं।

danieljvdm 3 अग॰ 2017

वही मैं आपको आपके कोड के बारे में बता सकता था - मुझे पूरी परियोजना और सभी विवरण नहीं दिख रहे हैं। उदाहरण के लिए आप Actions.map का उपयोग कर सकते हैं और यह संकलन के दौरान उत्पन्न नहीं हो सकता है (और शून्य हो सकता है)।

aksonov 3 अग॰ 2017

यदि आप मुझे बताएं कि आपको क्या चाहिए, तो मुझे अधिक कोड नमूने प्रदान करने में प्रसन्नता हो रही है। Actions.map काम करता है, यह सिर्फ उस तरफ से संक्रमण करता है जो मैं नीचे से होने की उम्मीद करता हूं।

क्या आप कह रहे हैं कि आपके पास एक ही ऐप में push और modal दोनों ट्रांज़िशन नहीं हो सकते हैं?

danieljvdm 3 अग॰ 2017

हे भगवान। ऐप में नहीं, बल्कि एक कंटेनर में। अधिक गहराई से देखने के बाद आपके कोड में त्रुटि है - 'मानचित्र' अभी भी 'सामान्य' कंटेनर (कुंजी = रूट) का बच्चा है, न कि मोडल (कुंजी = 'मोडल')। ऐसा लगता है कि आप समझ नहीं पा रहे हैं कि आप क्या कर रहे हैं। हो सकता है कि यह घटक आपके लिए बहुत जटिल हो...

इसे इस्तेमाल करे:

<Router>
    <Scene key="modal" modal>
      <Scene key="root" hideNavBar hideTabBar>
        <Scene key="tabBar" tabs>
          <Scene key="listings" component={Listings} title="Listings" initial right={MapButton} />
          <Scene key="favorites" component={Favorites} title="Favorites" />
          <Scene key="messages" component={Messages} title="Messages" />
          <Scene key="profile" component={Profile} title="Profile" />
        </Scene>
      </Scene>
        <Scene key="map" component={Map} title="Map" hideNavBar />
        <Scene key="listingDetail" component={ListingDetail} title="Listing Detail" clone />
    </Scene>
  </Router>

aksonov 3 अग॰ 2017

👎59 😕7 👍6

danieljvdm 3 अग॰ 2017

👍44 😄1

यहाँ कुछ हालिया पोस्ट JSX सिंटैक्स और नेविगेशन कंटेनरों की समझ के बारे में हैं, दस्तावेज़ीकरण के बारे में नहीं।
मैंने मोडल के बारे में और जानकारी जोड़ी।

aksonov 3 अग॰ 2017

👍1

नमस्ते,

मेरे लिए काम किया

<Router navigationBarStyle={{backgroundColor: '#FF5722'}} titleStyle={{color: '#fff'}}>
        <Modal>
            <Stack key="root">
                <Scene key='login_screen' component={LoginScreen} title='login' hideNavBar={true} />
            </Stack>
            <Scene key='cadastro_screen' component={CadastroScreen} title='Cadastro' hideNavBar={false} />
        </Modal>
</Router>

pedrogoiania 13 सित॰ 2017

👍2 🎉1

जब मैं मोडल रैपर जोड़ता हूं तो मुझे अपने दृश्य के शीर्ष पर 2 नेवबार मिलते हैं, जब मैं HideNavBar जोड़ता हूं तो दोनों गायब हो जाते हैं। मैं इस मुद्दे को कैसे हल कर सकता हूं मैं एक टैब बार चाहता हूं केवल दो स्पष्ट रूप से नहीं ...?

hugoh59 25 जन॰ 2018

<Modal hideNavBar> का उपयोग करें क्योंकि <Modal> अपना स्वयं का नेवबार जोड़ने वाला है ताकि आप अपने मूल दृश्य से एक के साथ दो को समाप्त कर सकें।

tquiroga 5 मार्च 2018

👍2

क्या यह पृष्ठ उपयोगी था?

0 / 5 - 0 रेटिंग्स

React-native-router-flux: मोडल का उपयोग कैसे करें

संस्करण

सबसे उपयोगी टिप्पणी

सभी 16 टिप्पणियाँ

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