reactjs – 结合React和React-Native

前端之家收集整理的这篇文章主要介绍了reactjs – 结合React和React-Native前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个关于在React-native app中组合React元素的问题.
这样的事情可能吗?
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

不可能. React Native环境使用本机组件,而不是实际的DOM,因此您不能简单地在此环境中使用React组件并将其称为一天.

你最好的方法是寻找原生替代品.

理论上,您可以创建一个本机组件,该组件将创建Web视图,并在该视图中呈现其子项.您将需要使用私有的ReactMultiChild API – 实际上,这就是React组件用于允许在除DOM之外的其他东西上进行渲染的内容,例如canvas.

例如,react-canvas就可以了,我也是在my side project自己做的,也是用帆布做的.它看起来像这样:

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

在这个例子中,CanvasRect将由Canvas呈现在canvas元素上,而不是实际的DOM上.

因此,可以将多个渲染器连接在一起.对于您的用例,尽管如此,在React Native中为Web组件创建一个类似于桥梁的桥梁可能是一种过度杀伤.

(编辑:我写过a post on custom React renderers.虽然它没有触及React Native,但这种方法非常普遍.)

猜你在找的React相关文章