keyboard_return  چسبون مقالات آموزشی آموزش فارسی react native state در react native
  1. آموزش فارسی react native
  2. state در react native

state در react native

داده ها در React Components توسط state و props مدیریت می شوند. در این قسمت ما درباره state صحبت خواهیم کرد.

تفاوت بین state و props

به طور کلی state(وضعیت) تغییر پذیر است در حالیکه props(ویژگی با properties) غیر قابل تغییر است. این به این معنی است که state در آینده می تواند به روز شود، در حالیکه props را نمی توان به روزرسانی کرد.

نحوه استفاده از state

به طور کلی، شما باید state را در متد constructor مقداردهی کنید و سپس وقتی که می خواهید آن را تغییر دهید، setState را Call کنید.

برای مثال:

فایل App.js را باز کنید و این تغییرات را اعمال نمایید:

import React, { Component } from 'react';
import { AppRegistry, Text, View } from 'react-native';

class Blink extends Component {
  constructor(props) {
    super(props);
    this.state = {isShowingText: true};

    // Toggle the state every second
    setInterval(() => {
      this.setState(previousState => {
        return { isShowingText: !previousState.isShowingText };
      });
    }, 1000);
  }

  render() {
    let display = this.state.isShowingText ? this.props.text : ' ';
    return (
      <Text>{display}</Text>
    );
  }
}

export default class BlinkApp extends Component {
  render() {
    return (
      <View>
        <Blink text='I love to blink' />
        <Blink text='Yes blinking is so great' />
        <Blink text='Why did they ever take this out of HTML' />
        <Blink text='Look at me look at me look at me' />
      </View>
    );
  }
}

// skip this line if using Create React Native App
AppRegistry.registerComponent('AwesomeProject', () => BlinkApp);

در این مثال ما یک متن چشمک زن ایجاد کردیم. که با متد setInterval هر یک ثانیه خاموش و روشن می شود!

در این مثال ما برای این از props استفاده نکرده ایم چون وضعیت متن درحال تغییر است. بنابراین باید از state استقاده نماییم!

خروجی:

state

آموزش های ویدئویی ری اکت نیتیو درحال برگزاری می باشد. در این لینک می توانید به ویدئو های آموزشی React Native دسترسی داشته باشید:

فیلم فارسی آموزش react native

state در react native - 3.8 از 5 بر اساس 150 رای

امتیاز کاربران

state در react native
دیدگاه‌ها
saeed saeed 2 سال پیش
سلام من زمان اجرا دستور react-native run android خطا No emulators found as an output of `emulator -list-avds` رو دریافت میکنم شبیه سازم هم از طریق avd mannager نرم افزار android studio ساختم و run شده و متغیرهای java-home و android-home رو هم ست کردم هرکاری میکنم همین ارور رو میده اگه کمکم کنید واقعا ممنون میشم.
آرمان بابائی آرمان بابائی 2 سال پیش
درود بر شما. ببینید باید طبق ورژن ری‌اکت نیتیوی که نصب کردید اقدام به نصب ابزارهای SDK کنید. ورژن ری‌اکت نیتیو نصب شده خودتون رو اعلام کنید تا بهتر بشه کمکتون کرد. برای ادامه این بحث می‌تونید از قسمت "بپرس" سایت استفاده کنید.
مهدی مهدی 2 سال پیش
سلام؟ آیا دوره ریکت نیتیو رو ادامه میدید؟؟؟
آرمان بابائی آرمان بابائی 2 سال پیش
درود بر شما. بله حتما با ورژن جدیدتر ادامه می‌دیم.
محسن محسن 2 سال پیش
من تمام این مراحل رو رفتم اما خطایی هست که رفع نشده!! پرسشم رو با جزییات کامل تو لینک زیر گذاشتم ممنون اگر کسی میدونه کمکم کنه: https://stackoverflow.com/questions/58327218/unable-to-load-script-make-sure-youre-either-running-a-metro-serverrun-react
سعید سعید 2 سال پیش
با سلام و وقت بخیر. ببخشید من هر وقت میخام ری اکت نیتیو بنویسم، اندروید استودیو رو باز میکنم و شبیه ساز خود اندروید استودیو رو باز میکنم و از اون استفاده میکنم. آیا راه حلی هست که مثلا nox رو نصب کنیم و بدون اینکه اندروید استودیو رو باز کنیم فقط با باز کردن nox به کدنویسی بپردازیم؟ اگر لینک آموزشی دارید ممنون میشم در اختیارم قرار بدید
آرمان بابائی آرمان بابائی 2 سال پیش
درود بر شما. صد در صد راه های مختلفی وجود داره. برای مثال من آموزش ویدیویی شبیه ساز genymotion رو با ری‌اکت نیتیو ضبط کردم که می‌تونید دوره رو تهیه و مشاهده کنید. لینک: https://chasboon.ir/series/react-native-video-tutorial
sima sima 3 سال پیش
سلام. جسارتا مگه قرار نیست ری اکت نیتیو به ما در خروجی، اپ اندروید و iOS بدهد؟ با این تفسیر من معنی این جمله را نمیفهمم: " آموزش نحوه نصب react native در سیستم عامل ویندوز برای اندروید را آموزش می دهیم."
آرمان بابائی آرمان بابائی 3 سال پیش
بله در خروجی هم اندروید هم IOS به ما خروجی میده. اما طریقه نصب ری اکت نیتیو در سیستم عامل های ویندوز و mac متفاوت هست. اما برای این گفتم اندروید چون قبل از شروع کدنویسی با ری اکت نیتیو باید نیازمندی های اندروید و IOS رو روی سیستم خودمون نصب کنیم. و من در این آموزش فقط آموزش نصب نیازمندی های اندروید رو توضیح دادم
حسن قلی حسن قلی 3 سال پیش
زبان اندروید نداریم که ، یکی از زبان های اصلی برای نوشتن برنامه های اندروید جاوا هست
آرمان بابائی آرمان بابائی 3 سال پیش
اندروید مشتق شده از جاوا هست و نه خود جاوا. هم میشه گفت زبان جاوا هم میشه گفت زبان اندروید.
حسن قلی حسن قلی 3 سال پیش
اندروید یکی از توزیع های سیستم عامل لینوکس هست. و جاوا زبان برنامه نویسی هست که می تونیم برای تمامی دستگاه ها برنامه نوشته و بدون محدودیت سیستم عامل اجرا کنیم
آرمان بابائی آرمان بابائی 3 سال پیش
اندروید از کرنل لینوکس استفاده می کنه و نمیشه گفت یک توزیع از لینوکس هست.
حاتم حاتم 3 سال پیش
با سلام آقا سال 97 هم تموم شد و شماهنوز این آموزش رو آپدیت نکردید. منتظریم. موفق باشید.
آرمان بابائی آرمان بابائی 3 سال پیش
سلام. تعداد ثبت نام کنندگان به حد نصاب که برسه دوره رو شروع میکنیم. ممنون از پیگیری شما.
داود داود 3 سال پیش
سلام. ممنون از آموزش های خوب و بیان عالی تون. لطفا آموزش ری اکت نیتیو رو ادامه بدید که جای خالی آموزش شما در اینترنت بشدت احساس میشه. موفق باشید.
آرمان بابائی آرمان بابائی 3 سال پیش
ممنون از فیدبک شما. حتما این دوره رو ادامه میدیم و از بهترین آموزش های فارسی خواهد بود.
حسن حسن 4 سال پیش
سلام خسته نباشید.لطفا ری اکت رو ادامه بدید. ممنون
آرمان بابائی آرمان بابائی 4 سال پیش
سلام. حتما هم آموزش ویدیویی اضافه خواهیم کرد. هم مقاله.
حاتم حاتم 4 سال پیش
آقا عالیه، ادامه بدین و یه اپ کامل رو توی دستور کارتون قرار بدین. مخصوصا اتصال به سرور و خوندن دیتابیس. ممنون
آرمان بابائی آرمان بابائی 4 سال پیش
به زودی در ویدیوهای آموزشی تمامی مقوله ها رو کاملا شرح می دم.
حاتم حاتم 4 سال پیش
با سلام مجدد... آقا همچنان منتظر آموزش های شما هستم.
آرمان بابائی آرمان بابائی 4 سال پیش
سلام. خوشحالیم از پیگیری شما. درحال ساخت آموزش های ویدئویی هستیم.
حاتم حاتم 4 سال پیش
خیلی عالی
صفورا صفورا 4 سال پیش
مقاله بسیار مفیدی بود خواهش میکنم آموزش React رو ادامه بدید. سپاسگزارم
آرمان بابائی آرمان بابائی 4 سال پیش
خوشحالیم مورد رضایت شما قرار گرفته . حتما ادامه خواهد داشت.

2021 © Copyright کليه حقوق مادی و معنوی براي چسبون محفوظ است و هرگونه کپی برداری پیگرد قانونی دارد.