ホームページ >ウェブフロントエンド >jsチュートリアル >React Native の重要なコア コンポーネントをリストする

React Native の重要なコア コンポーネントをリストする

WBOY
WBOY転載
2023-09-08 21:25:06868ブラウズ

React Native の最も重要なコア コンポーネントは次のとおりです-

アプリが Android デバイスに表示されると、548e7793df275d156d270cdda504ba19 コンポーネントは 7b55e845865ed5229d0ea222bb08d5e9アプリが Android デバイスに表示されるとき、7afbc23223af17d69e2ad2a4e42c6248 コンポーネントc398514c3e3771c7c856bd5623ce1ff8アプリケーションが Android デバイスの c57f1e7288184f7433124ca4739271f3 コンポーネントを認識したときアプリが IOS デバイスで表示されると、1510c774b1594fafafc2ba10dbf90fe9Scrollview - cc64e9eba48df49c2b22d3ab3fc1cfdfアプリケーションが Android デバイスで表示されると、cc64e9eba48df49c2b22d3ab3fc1cfdf コンポーネントは 1f670029a047d2aebda1c9241e3975bf

に変わります。

アプリケーションが Android デバイスに表示されるとき、3bda1eaf2818b810be2a25a0a48094bbコンポーネントは 4fd0db87786572d5bb22974cf6a288d3Text、View、Image、ScrollView、TextInput を使用するには、次の操作を行う必要があります。以下に示すように、react -native import コンポーネントから開始します-
import { View, Text, Image, ScrollView, TextInput } from 'react-native';
View コンポーネントは主にテキスト、ボタン、画像などを保存するために使用されます。このコンポーネントの使用法は次のとおりです-
React Native コンポーネント Android ネイティブ ビュー IOS ネイティブ表示 Web ブラウザ 説明
#表示-b3f6d2e99bd71dbb2b65ad40c92bf0e0

##アプリが IOS デバイスに表示されると、548e7793df275d156d270cdda504ba19 コンポーネントが変更されますWeb ブラウザで表示すると、548e7793df275d156d270cdda504ba19 コンポーネントは dc6dce4a544fdca2df29d5ac0ea9906b タグ

## に変更されます。は、フレックスボックス レイアウトをサポートするコア コンテナーです。タッチ操作も管理します。

Text - 7afbc23223af17d69e2ad2a4e42c6248

に変更されます。アプリケーションが IOS デバイスで表示されると、7afbc23223af17d69e2ad2a4e42c6248 コンポーネントは 15da638d5cfcec0a99eb38297c6012eb # に変更されます。

# Web ブラウザで表示すると、7afbc23223af17d69e2ad2a4e42c6248 コンポーネントは、ユーザーにテキストを表示するために使用される e388a4556c0f65e1904146cc1a846bee タグ

に変わります。スタイルやタッチイベントも処理します。

画像 - c57f1e7288184f7433124ca4739271f3

に変更されます。be6f9d9f8d3942f7e92b94b40bc4843d コンポーネントは 5a1331ec3bc21641e8b198e67846b424 に変更されます。

Web ブラウザで表示すると、be6f9d9f8d3942f7e92b94b40bc4843d コンポーネントは、画像の表示に使用される a1f02c36ba31691bcfe87b2722de723b タグ

に変わります。

アプリケーションが IOS デバイスで表示されると、cc64e9eba48df49c2b22d3ab3fc1cfdf コンポーネントは d0ff0624d90fab52e480f913eef08e4d

に変わります。 Web ブラウザで表示すると、cc64e9eba48df49c2b22d3ab3fc1cfdf コンポーネントは、コンポーネントとビューのスクロール コンテナを含む dc6dce4a544fdca2df29d5ac0ea9906b タグ

TextInput - 3bda1eaf2818b810be2a25a0a48094bb

に変更されます。アプリケーションが IOS デバイスで表示されると、3bda1eaf2818b810be2a25a0a48094bb コンポーネントは 4fd0db87786572d5bb22974cf6a288d3 から 052e7434143fb5cd73fe5438953c55a8## に変更されます。 #3bda1eaf2818b810be2a25a0a48094bb コンポーネントが Web ブラウザで表示されると、23efcc05e98690ceeb219581933e4231 タグに変更されます。

ユーザーがテキストを入力できる入力要素

以下は、548e7793df275d156d270cdda504ba19、7afbc23223af17d69e2ad2a4e42c6248、be6f9d9f8d3942f7e92b94b40bc4843d、cc64e9eba48df49c2b22d3ab3fc1cfdf、3bda1eaf2818b810be2a25a0a48094bb

<View>
   <Text style={{ padding:"10%", color:"red" }}>Inside View Container</Text>
   <Image
      source={{
         uri: &#39;https://www.tutorialspoint.com/react_native/images/logo.png&#39;,
      }}
      style={{ width: 311, height: 91 }}
   />
</View>

その中にはテキストと画像のコンポーネントがあります。 ScrollView コンポーネントは、View、Text、Image、Button、およびその他の React Native コンポーネントを処理する親コンポーネントのように動作します。

import React from 'react';
import { View, Text, Image, ScrollView, TextInput } from &#39;react-native&#39;;

const App = () => {
   return (
      
         Welcome to TutorialsPoints!
         
            Inside View Container
            
      
      
      
   );
}
export default App;

出力

p>

以上がReact Native の重要なコア コンポーネントをリストするの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はtutorialspoint.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。