جستجو برای:
سبد خرید 0
  • آی آر پروگرم
  • آموزش ها
    • آموزش های ویدئویی
    • آموزش های متنی
  • بلاگ
  • چارت آموزشی آی آر
  • ابزار های برنامه نویسی
  • پادکست ها
  • بانک کد
 

ورود

رمز عبور را فراموش کرده اید؟

هنوز عضو نشده اید؟ عضویت در سایت
  • 09306889067
  • info@irprogram.com
perm_identity
سبد خرید 0
  • تماس با ما
  • داستان آی آر
  • پشتیبانی
  • پرسش و پاسخ
0
آموزش برنامه نویسی
ورود و ثبت نام
دسته بندی دوره ها
  • آموزش های برنامه نویسی موبایل
    • آموزش طراحی اینستاگرام با React Native
    • آموزش مقدماتی react native
    • آموزش اکما اسکریپت
    • دوره آموزش phonegap
    • آموزش custom dialog در اندروید
    • آموزش استفاده از کتابخانه glide در اندروید
    • آموزش اندروید کرکینگ ۲۰۱۹
    • آموزش استفاده از کتابخانه tasty toast در اندروید
    • دوره آموزش JQuery Mobile
    • دوره جامع آموزش زامارین اندروید
    • آموزش استفاده از کتابخانه Picasso در اندروید
    • آموزش استفاده از کتابخانه Circle ImageView در اندروید
    • آموزش استفاده از کتابخانه Material Text Field در اندروید
    • آموزش استفاده از کتابخانه Photo View در اندروید
    • آموزش استفاده کتابخانه Progress Whell در اندروید
    • آموزش react native
    • آموزش اندروید
  • آموزش های برنامه نویسی وب
    • آموزش پروژه محور html
    • دوره آموزش css
    • آموزش پروژه محور جاوا اسکریپت
    • آموزش پروژه محور جی کوئری
    • آموزش های طراحی سایت
    • آموزش های وردپرس
    • آموزش طراحی صفحات وب
    • آموزش css
    • آموزش html
    • آموزش های وردپرس
    • آموزش افزونه های وردپرس
    • آموزش افزونه yoast
  • آموزش های صد روز تا دولوپری
    • آموزش html
    • آموزش css
    • آموزش phonegap
    • آموزش جی کوئری
    • آموزش جی کوئری موبایل
    • آموزش جاوا اسکریپت
  • آموزش های رایگان
    • همه آموزش های رایگان
  • همه دوره های کسب و کار و درآمد دیجیتالی (بیت کوین و بازار فارکس)
    • بازار فارکس
    • بازار فارکس ۲
    • بیت کوین و بلاک چین
    • خلق مدل کسب و کار
  • آی آر پروگرم
  • آموزش ها
    • آموزش های ویدئویی
    • آموزش های متنی
  • بلاگ
  • چارت آموزشی آی آر
  • ابزار های برنامه نویسی
  • پادکست ها
  • بانک کد

وبلاگ

آموزش برنامه نویسی > بلاگ > آموزش react native > نحوه ارتباط با اپلیکیشن از طریق دریافت ورودی در react native

نحوه ارتباط با اپلیکیشن از طریق دریافت ورودی در react native

access_time۱۲ آذر ۱۳۹۸
perm_identity ارسال شده توسط irpogramauthor
folder_open آموزش react native ، آموزش برنامه نویسی
visibility 32 بازدید

نحوه ارتباط با اپلیکیشن از طریق دریافت ورودی

استفاده از کادر ورود متن

textInput یک تگ پایه هست که به کاربراجازه میده که متنی رو وارد کنه. و prop یا پایه ی onChangeText رو داره که که یک تابع رو در هر بار که متن تغییر پیدا میکنه فراخوانی میکنه و همچنین یک پایه ی onSubmitEditing داره که یک تابع رو در هر زمان که متن فرستاده بشه فراخوانی میکنه.

به عنوان مثال، بیاین بگیم که همونطورکه کاربر داره تایپ میکنه، شما دارین کلماتشو به یه زبان دیگه ترجمه میکنین. به ازای هر کلمه علامت  🍕نوشته میشه. پس جمله سلام باب اینجوری ترجمه میشه: ” 🍕 🍕 “

۱
۲
۳
۴
۵
۶
۷
۸
۹
۱۰
۱۱
۱۲
۱۳
۱۴
۱۵
۱۶
۱۷
۱۸
۱۹
۲۰
۲۱
۲۲
۲۳
۲۴
۲۵
۲۶
۲۷
import React, { Component } from 'react';
import { AppRegistry, Text, TextInput, View } from 'react-native';
 
export default class PizzaTranslator extends Component {
  constructor(props) {
    super(props);
    this.state = {text: ''};
  }
 
  render() {
    return (
      <View style={{padding: ۱۰}}>
        <TextInput
          style={{height: ۴۰}}
          placeholder="Type here to translate!"
          onChangeText={(text) => this.setState({text})}
        />
        <Text style={{padding: ۱۰, fontSize: ۴۲}}>
          {this.state.text.split(' ').map((word) => word && '🍕').join(' ')}
        </Text>
      </View>
    );
  }
}
 
// skip this line if using Create React Native App
AppRegistry.registerComponent('AwesomeProject', () => PizzaTranslator);

.نتیجه کد های بالا به صورت زیر خواهد بود

بیشتر بخوانید  روش های چیدن محتوا در صفحه با react native

توی این مثال ما text رو ذخیره میکنیم چون طی زمان تغییر میکنه.

چیزای زیادی هست که شما میتونین با کادر ورود متن انجام بدین. به عنوان مثال، شما میتونین متن وارد شده رو اعتبارسنجی یا راستی آزمایی کنین. برای جزئیات بیشتر لینک های زیر رو یه نگاهی بندازین.

https://reactjs.org/docs/forms.html#controlled-components

https://facebook.github.io/react-native/docs/textinput

وروی متن یکی از راه های ارتباط بقرار کردن کاربر با اپلیکیشن هست. شما میتونین یک نوع دیگه ورودی رو توی لینک زیر ببینین:

https://facebook.github.io/react-native/docs/handling-touches

لینک مقاله:

https://facebook.github.io/react-native/docs/handling-text-input

اشتراک گذاری:
مطالب زیر را حتما بخوانید
  •  گذاشتن افکت برای هاور تصاویر

    3 بازدید

  • ساخت گرادیانت رنگین کمانی متحرک

    7 بازدید

  • انتشار اپلیکیشن اندروید React Native در گوگل پلی استور

    11 بازدید

  • ساخت دکمه Volume با HTML و CSS

    12 بازدید

  • طراحی رادار با HTML و CSS

    14 بازدید

جدید تر نحوه استفاده از نمای دارای نوار لغزنده در react native
قدیمی تر بهترین وبسایت ها برای یادگیری کدنویسی و توسعه وب در سال 2019

پاسخی بگذارید لغو پاسخ

جستجو
جستجو برای:
مطالب بلاگ آی آر
  • Uncategorized (۵)
  • آموزش PHP (۱۰)
  • آموزش react native (۴۹)
  • آموزش اندروید (۱۳)
  • آموزش ایلاستریتور (۴۹)
  • آموزش برنامه نویسی (۲۰۱)
  • آموزش خرید از وبسایت های خارجی (۱۶)
  • آموزش طراحی صفحات وب (۸۲)
    • آموزش css (۳۹)
    • آموزش html (۴۵)
  • آموزش های فتوشاپ (۶۶)
  • آموزش های وردپرس (۵۳)
    • آموزش افزونه های وردپرس (۳۲)
      • آموزش افزونه yoast (۱۳)
  • ابزار های برنامه نویسی (۵۵)
  • استارتاپ و کسب و کار (۱۵۹)
  • انگیزشی (۴۰)
  • بانک کد (۴۶)
  • پادکست (۲)
  • دسته‌بندی نشده (۳)
  • کسب و کار آنلاین (۱۲)
  • مرجع برنامه نویسی (۴)
  • مطالب متفرقه (۵۶)
  • معرفی ایده (۴)
  • معرفی زبان های برنامه نویسی (۴)
  • معرفی کتاب (۵)
  • معرفی ویرایشگرها (۱)
  • مقایسه (۴)
جدیدترین مطالب بلاگ آی آر
  •  گذاشتن افکت برای هاور تصاویر ۱۲ آذر ۱۳۹۸
  • چرا اینقدر بیکار داریم ؟ ۱۲ آذر ۱۳۹۸
  • ساخت گرادیانت رنگین کمانی متحرک ۱۲ آذر ۱۳۹۸
  • انتشار اپلیکیشن اندروید React Native در گوگل پلی استور ۱۲ آذر ۱۳۹۸
  • ساخت دکمه Volume با HTML و CSS ۱۲ آذر ۱۳۹۸
دوره های آموزشی آی آر
  • تحلیل تکنیکال بازارهای بورس ، فارکس و ارزهای دیجیتال( چهارمین دوره از مجموعه صد روز تا درآمد دیجیتالی)
  • آموزش طراحی اینستاگرام با React Native
  • بازار فارکس2- فارکس مقدماتی( سومین دوره از مجموعه صد روز تا درآمد دیجیتالی)
  • بیت کوین و بلاک چین (اولین دوره از مجموعه صد روز تا درآمد دیجیتالی)
  • بازار فارکس (دومین دوره از مجموعه صد روز تا درآمد دیجیتالی)
  • خلق مدل کسب و کار (اولین دوره از مجموعه کسب و کار نوین)
  • دوره جامع آموزش زامارین اندروید
    دوره جامع آموزش زامارین اندروید
  • دوره آموزش phonegap (دوره ششم از آموزش صد روز تا دولوپری)
تماس با ما
  • location_on
    استان خراسان جنوبی پارک علم و فناوری اتاق 111
  • phone_android
    09306889067
  • email
    info@irprogram.com
دسته بندی دوره های آی آر
  • برنامه نویسی موبایل
  • برنامه نویسی وب
  • آموزش های رایگان
  • آموزش بیت کوین
  • آموزش وردپرس
  • آموزش طراحی سایت
درباره آی آر پروگرم

آی آر پروگرم یه وب سایت آموزش آنلاین نیست ! بلکه وب سایتیه که شما با آموزش های اون میتونین آینده خودتون رو بسازین .

آموزش های آی آر پروگرم در حوزه های برنامه نویسی وب ، برنامه نویسی موبایل ، برنامه نویسی ویندوز و کسب درآمد دیجیتال و راه اندازی کسب و کار هستند .

ما آی آر پروگمی ها میخوایم با آموزش برنامه نویسی به بهتر و راحت تر کردن زمین برای زندگی کمک کنیم .

نماد های اعتماد ما
تمامی حقوق مادی و معنوی وب سایت irprogram برای شرکت فرزان فناوران پویان محفوظ است .
keyboard_arrow_up