Kombinieren von Reagieren und Reagieren-Native

Question

Ich habe eine Frage in Bezug auf die Kombination von Elementen von React in React-native App. Konnte so etwas möglich sein?

Ich frage dies, weil ich Probleme habe, Barcode-Generator-Modul für react-native zu finden. Irgendwelche Vorschläge?

Danke für alle Antworten,
Dome

Answer 1

Nicht möglich. React Native-Umgebung verwendet native Komponenten unter der Haube, nicht das eigentliche DOM, so dass Sie nicht einfach React-Komponenten in dieser Umgebung verwenden und es einen Tag nennen können.

Am besten suchen Sie nach nativen Alternativen.

---

Sie könnten theoretisch schaffen eine native Komponente, die eine Web-Ansicht erstellen, und machen ihre Kinder in dieser Ansicht. Sie müssen die privateReactMultiChild API verwenden - in der Tat, das ist, was React-Komponenten verwenden, um das Rendering auf andere Dinge als DOM, wie Canvas.

Zum Beispiel, react-canvas tut es, ich habe es auch selbst auf my side project, auch mit Leinwand. Es sieht wie folgt aus:

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

In diesem Beispiel CanvasRect wird durch Canvas auf ein Canvas-Element gerendert werden, nicht die tatsächliche DOM.

So ist es auf jeden Fall möglich, mehrere Renderer zusammen zu überbrücken. Für Ihren Anwendungsfall kann es jedoch ein Overkill sein, wenn Sie in React Native eine Brücke wie die für Web-Komponenten erstellen.

(Edit: Ich habe geschrieben a post on custom React renderers Während es nicht india Reagieren nicht berührt, der Ansatz ganz allgemein..)

Answer 2

Was Sie brauchen, im Wesentlichen eine Abbildung von den reagieren-native Komponenten Komponenten zu reagieren (tatsächliches DOM-Objekt) React-Native-Web tut genau das. Sie können die Komponenten von React und React-Native verschachteln.

z.B.

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

Dieser Code wird transformieren und wird tatsächlich DOM (nicht die hübscheste, aber macht den Job). Momentan unterstützt es nicht das Mapping für alle Komponenten, unterstützt aber die meisten.

React-Native-Web hängt stark von der webpack. Stellen Sie also sicher, dass Sie ein gutes Verständnis von webpack haben, bevor Sie sich damit beschäftigen.