realm in React Native (این قسمت یه مثال ساده از نوشتن روی ریلم)

خوب سلام بچهاااامروز می خوام یه مثال خیلی ساده از ریلم براتون بگم و کنار هم یاد بگیریمریلم خوب یه دیتابیس برای ری اکت نیتیوعه که اگه داده ها توی برنامتون زیاد باشه این ریلم میاد به سراغتونمن پارسال سعی در امتحان کردنش داشتم ولی اخر سر فهمیدم که باگ خود ری اکت نیتیو بودعه و اون ورژن با ریلم اوکی نبوده اخلاقاشون بعد سراغش دیگه نیومدم و کلا بیخیالش شدم -.-دوباره چند روزعه که امدم سراغش که همه چی اوکی بود جزء نمایش ندادن داده ها چند روزی گذشت من اعصابم خورد تا امروز که فهمیدم ریلم با ورژن 59 ری اکت مشکل دارعه و با ورژن 57.8 اوکی میشهخواستین پروژه بسازین با این دستور بسازیدreact-native init test --version react-native@0.57.8بعد ریلم نصب کنید و یادتون نرعه لینکش کنید این ویرگولم ممکنه دو قسمتی بشه مبتدی و پیشرفتهاگه اول کار متوجه اموزش نشدین روزنامه وار بخونید و تا اخر پیش برید وقتی ui بیاد وسط مطمئنم بهتر می فهمید قسمت اول اموزش روخوب اول کار ساخت nameSchemaاست که فکر کنم همون تیبل مون باشه const NameSchema = { name: 'NameSchema', };خوب بعد چیزهایی که می خواییم ذخیره کنیم اینجا فقط یه رشته خالی ذخیره می کنیم پسconst NameSchema = { name: 'NameSchema', properties: { name: 'string',//field haee k mikhaeem to tableMon bashn inja minevisim } };تا اینجا میشه گفت تنظیمات دیتابیس انجام دادیم الان باید بریم سراغ ری اکت نیتیو و اتصالش به ریلم(اشتباه نکنید تموم این کدها که دارم میگ همه توی app.js و یه کامپونت بیشتر نیست)خوب یه رشته ممکنه خالی باشه یا داده بنویسم یا داده مونو تغیر بدیم پس نیاز به state که خوب state بدون constructor نمیشهconstructor(props){ super(props); this.state={ text: ' ', realm:null, //inja hamei text hai bala ro negah midare } }خوب ما توی این مثال می خواییم توی ریلم اطلاعات بنویسیم پس نیازه به متدwrite_to_db(){ Realm.open({schema: [NameSchema]}) //badihiye k byd table open konim ta btonim bnvsim .then(realm => { // Create Realm objects and write to local storage realm.write(() => { realm.create('NameSchema', { name: this.state.text, }); }); const db=realm.objects('NameSchema').map(x => Object.assign({}, x)); this.setState({ realm:db}); }) }خوب شاید شما مث من فکر کنیدکه این خط کد به چه دردی میخورعه const db=realm.objects('NameSchema').map(x => Object.assign({}, x)); وقتی کنسول بگیریم از db اینو نشون میده البته واضحه که من دوتا داده ذخیره کردم اینجا [ { name: 'a' }, { name: 'ab' } ]خوب حالا ما اینجا داریم محتوای db را میریزیم توی استیت ریلم خودمون که اول کار نال بود this.setState({ realm:db});میرسیم به قسمت خوب برنامه و اون uiعهrender() { return ( <View > <TextInput style={styles.textInput} underlineColorAndroid="transparent" returnKeyType="done" placeholder={'یک نام وارد کنید'} Text={(text)=>this.setState({text:text})}/> //inja miyad v har dadee k karbar zad ro mirize to state <TouchableOpacity onPress={()=>this.write_to_db()}> <Text >Add to database</Text> </TouchableOpacity> <View style={{backgroundColor:'yellow',top:50}}> //inja mige age khali nbod biya v dade haee k toi state realm ma save kardim map ya negashtSh kon roi text k karbar bbne {this.state.realm!==null ? this.state.realm.map((item,index)=> <Text>{index}{item.name}</Text> //index k gozashtm shomare gozari mikone ) : null //age k hichi nnvesht karbar k meghdar null bezar toi text input } </View> </View> ); } }کد کامل میشه import React, {Component} from 'react'; import { StyleSheet, Text, View,TextInput,TouchableOpacity} from 'react-native'; const Realm = require('realm'); const NameSchema = { name: 'NameSchema', properties: { name:'string', } }; export default class App extends Component { constructor(props){ super(props); this.state={ text:'', realm:null, } } write_to_db(){ Realm.open({schema: [NameSchema]}) .then(realm => { // Create Realm objects and write to local storage realm.write(() => { realm.create('NameSchema', { name: this.state.text, }); }); const db=realm.objects('NameSchema').map(x => Object.assign({}, x)); console.log("db",db) this.setState({ realm:db}); }) } render() { return ( <View > <TextInput style={styles.textInput} underlineColorAndroid="transparent" returnKeyType="done" placeholder={'یک نام وارد کنید'} Text={(text)=>this.setState({text:text})}/> <TouchableOpacity onPress={()=>this.write_to_db()}> <Text >Add to database</Text> </TouchableOpacity> <View style={{backgroundColor:'yellow',top:50}}> {this.state.realm!==null ? this.state.realm.map((item,index)=> <Text>{index}{item.name}</Text> ) : null } </View> </View> ); } } const styles = StyleSheet.create({ container: { flex: 1, justifyContent: 'center', alignItems: 'center', backgroundColor: '#F5FCFF', }, textInput:{ textAlign: 'center', borderColor:'#D64181', borderWidth: 3, paddingRight: 10, justifyContent: 'center', margin: 15, fontSize: 14 }, });منبع اشو یادم نیست و خیلی وقته می خوام اینو بنویسم هر موقع دیدم حتما اضافه می کنم براتون