रिएक्ट और रिएक्ट-नेटिव का मिश्रण

Question

मेरे पास प्रतिक्रिया-मूल ऐप में प्रतिक्रिया के तत्वों के संयोजन के बारे में एक प्रश्न है। ऐसा कुछ संभव हो सकता है?

import React, { Component } from 'react'; 
import { 
    AppRegistry, 
    StyleSheet, 
    Text, 
    View, 
    Image, 
    ListView, 
    Switch, 
    TextInput, 
    AsyncStorage, 
    BackAndroid, 
    Navigator, 
    TouchableOpacity, } from 'react-native'; 

var ReactDOM = require('react-dom'); 
var Barcode = require('react-barcode'); 


class Third extends React.Component { 
    ReactDOM.render(
     <Barcode value="http://github.com/kciter" />, 
     mountNode 
    ); 
}; 

मैं यह पूछ रहा हूं क्योंकि मुझे प्रतिक्रिया-मूल के लिए बारकोड जनरेटर मॉड्यूल खोजने में परेशानी है। कोई सुझाव?

, सभी उत्तरों के लिए धन्यवाद
Domen

Answer 1

संभव नहीं है। प्रतिक्रिया मूल वातावरण हूड के नीचे मूल घटकों का उपयोग करता है, वास्तविक डीओएम नहीं, इसलिए आप इस माहौल में केवल प्रतिक्रिया घटकों का उपयोग नहीं कर सकते हैं और इसे एक दिन बुला सकते हैं।

आपका सबसे अच्छा शॉट देशी विकल्पों की तलाश करना है।

---

आप सैद्धांतिक रूप से एक देशी घटक है, जो एक वेब दृश्य पैदा करेगा बनाते हैं, और उस दृश्य में अपने बच्चों को प्रस्तुत करना सकता है। आपको निजीReactMultiChild एपीआई का उपयोग करने की आवश्यकता होगी - वास्तव में, यह कैनवास की तरह डीओएम के अलावा अन्य चीज़ों पर प्रतिपादन की अनुमति देने के लिए प्रतिक्रिया घटक का उपयोग करता है।

उदाहरण के लिए, react-canvas ऐसा करता है, मैंने इसे my side project पर भी कैनवास के साथ किया। यह इस तरह दिखता है:

<Canvas> 
    <CanvasRect frame={[10, 10, 20, 20]} color="black" /> 
</Canvas> 

इस उदाहरण में, CanvasRect एक कैनवास तत्व, न कि वास्तविक डोम पर Canvas द्वारा प्रदान की गई किया जा रहा है।

तो कई प्रस्तुतकर्ताओं को एक साथ पुल करना संभव है। आपके उपयोग के मामले में, ग्राउंड-अप जा रहा है और रिएक्ट नेटिव में वेब घटकों के लिए ऐसा पुल बनाना हालांकि एक ओवरकिल हो सकता है।

(संपादित करें: मैंने लिखा गया है a post on custom React renderers यह स्पर्श नहीं करता है जबकि प्रतिक्रिया मूल निवासी, दृष्टिकोण काफी सामान्य है।।)

Answer 2

क्या आप अनिवार्य रूप से की जरूरत प्रतिक्रिया देशी घटकों से एक मानचित्रण घटकों प्रतिक्रिया करने के लिए है (वास्तविक डोम ऑब्जेक्ट)। React-Native-Web बस यही करता है। आप प्रतिक्रिया और प्रतिक्रिया-मूल के घटकों को घोंसला कर सकते हैं।

उदा

<ScrollView> 
<div>Hello World</div> 
</ScrollView> 

इस कोड को बदल सकते हैं और वास्तविक डोम पैदा करेगा (नहीं सुंदर, लेकिन काम करता है)। वर्तमान में, यह सभी घटकों के लिए मैपिंग का समर्थन नहीं करता है लेकिन उनमें से अधिकांश का समर्थन करता है।

प्रतिक्रिया-मूल-वेब webpack पर भारी निर्भर करता है। तो सुनिश्चित करें कि आप इसमें शामिल होने से पहले webpack की अच्छी समझ लें।