راهنمایی جهت افزایش توانایی کار با داده های جوااسکریپت

پرسیده شده
فعالیت 1201 روز پیش
دیده شده 350 بار
0

سلام استاد

دیتا رو به وسیله پرامپ به کامپوننت فرزند میفرستم ولی زمانی که میخوام با id یک قسمت state رو با setstate تغییر بدم ، نمیدونم دقیقا این مقداری که برگشته باشد چطور  باید توی setstate اعمال بشه.

احساس میکنم مشکل از توانایی تغییر توی ساختار ابجکت ها باشه که هنوز بنظرتون تو پروژه زدن این توانایی بیشتر میشه یا نیازه مطالب رو مرور کنم و تمرین بیشتری رو آبجکت ها انجام بدم؟

مشکلی که توی آموزش هست اینه زیاد مثال پیچیده با ابجکت ها نداشتیم

یه مثال از کدی که برام تجزیه اش سخته میذارم براتون

تشکر

 this.setState(({ boxes }) => {
            index = boxes.findIndex(box => box.id === index);
            boxes[index].numberClick += 1;
            return boxes;
        });
فایل پیوست

3
حذف شده

سلام

 

چند حالت رو با هم بررسی میکنیم. امیدوارم تا حدودی مشکلت برطرف بشه

class App extends Component {
 state = {
   foo: 1,
   boo: [1, 2, 3]
 }
 handlClick() {
   this.setState({ zoo: 5 })
 }
 render() {
   return <button onClick={this.handlClick.bind(this)}>click</button>
 }
}


در این حالت این setState به صورت میره مقداری رو که بهش پاس دادیم با state فعلی ترکیب میکنه و state دارای مقدار زیر میشه:

state = {
   foo: 1,
   boo: [1, 2, 3],
   zoo: 5
 }

اگر کد داخل handlClick رو تغییر بدیم به صورت زیر:

handlClick() {
   this.setState(state => {
     return { zoo: 5 }
   })
 }

در این حالت باز همون خروجی رو تحویل میکنیم و هیچ تغییری ایجاد نمیشه چون که مقدار خروجی تابعی که پاس دادیم با حالت قبلی تفاوتی نداره

 

اگر کد داخل handlClick رو تغییر بدیم به صورت زیر:

 handlClick() {
   this.setState(state => {
     return {
       boo: [...state.boo, 4, 5]
     }
   })
 }

در این حالت چون که از قبل مقدار boo داخل state وجود داره هر چیزی رو که تابع return بکنه جایگزین مقدار قبلی میشه:

state = {
   foo: 1,
   boo: [1, 2, 3, 4, 5]
 }

بخوام جمع بندی بکنم اگر مقداری که به setState  پاس میدی از قبل در state وجود نداشته باشه مقدار جدید اضافه میشه و در صورتی که وجود داشته باشه جایگزین مقدار قبلی میشه

 


 

 

 

موصوع بعدی که پرسیده بودی دارای دو جنبه میشه

یکی برمیگرده به مهارت حل مسئله و یکی هم برمیگرده به مباحث React

مورد اولی همونطوری که فقط با کدنویسی و تمرین بیشتر مشکل حل میشه و تا زمانی که خودت کدنویسی رو در حالت های مختلف تجربه نکنی حل نمیشه که البته با تمرین و مرور زمان حل میشه

 

یه بحث هم برمیگرده به مباحث react به دلیل اینکه همه مطالب جدید هست در ابتدا شاید یکمی برات سخت باشه که کاملا طبیعیه و جای نگرانی نداره! این مورد هم به مرور حل میشه چون هر چه جلوتر بریم بازم به صورت عملی میبینی که در چه جاهایی کاربرد داره مشکلت برطرف میشه

 

حالا یک موضوعی میمونه که اگر با یه بخشی از آموزش مشکل داری یا اینکه کلا درکش نکردی

در این صورت اگر این موارد رو اعلام بکنی در وبینارهایی که برگزار میکنیم از قبل در موردشون مطلب آماده میکنم و بیشتر توضیح میدم

یا اینکه در زمان وبینار بازم بپرسی اونجا هم بیشتر در موردش میتونیم صحبت بکنیم

فایل پیوست

مجتبی سوری

توسط

مجتبی سوری

26 دی 99