React Nativeコンポーネントタグのテキスト要素内へのマークアップの追加

Question

React Nativeプロジェクトのスタイルガイドにコード例を組み込もうとしていて、React Nativeを使わずにタグを含める方法が見つからない自体。それは、このようなコードブロックだと、私は一種のstackoverflowのようなものをシミュレートするために期待していた

はない：リアクトネイティブしようとするため

<View> 
    <Text> 
    // Example code for implementing custom button: 
    <CustomButton 
     color="primary" 
     title="Submit" 
    /> 
    </Text> 
</View> 

：

// Example code for implementing custom button: 
<CustomButton 
    color="primary" 
    title="Submit" 
/> 

だから、壊れ私のコードは次のようになりますボタンをレンダリングしてエラーをスローします。

React Nativeの中にあるHTMLの<code>タグに似たものがありますか、同じ機能を実現するカスタム方法がありますか？この作品を作るために

Answer 1

一つの方法は、いくつかの変数に文字列としてテキストを格納し、ちょうどレンダリングされたコンテナ内：jsx-to-stringと

let codeBlock = "<CustButton \n\tcolor=\"primary\" \n\ttitle=\"Placeholder\" \n/>" 

<View> 
    <Text> 
    // Example code for implementing custom button: 
    {codeBlock} 
    </Text> 
</View> 

Answer 2

、することができます

<View> 
    <Text> 
     {jsxToString(
      <CustomButton color="primary" title="Submit" /> 
     )} 
    </Text> 
</View> 

このjsxオブジェクトを手作業で文字列に変換するのではなく、簡単に再利用することができます。