কুকবুক

প্রায় প্রতিটি অ্যাপে আসা কাজের জন্য সংক্ষিপ্ত, কপি করে ব্যবহারযোগ্য রেসিপি। প্রতিটিই আসল $mol কোড——নামগুলো মিলিয়ে নিয়ে বসিয়ে দিন।

দ্বিমুখী বাউন্ড ইনপুট

কোনো হ্যান্ডলার তার না জুড়েই একটি ইনপুট আর একটি ডিরাইভড ভ্যালুকে সিঙ্কে রাখুন: <=> দুই দিকেই বাইন্ড করে, আর যে কম্পিউটেড প্রপার্টি সেই ভ্যালু পড়ে সেটি নিজে থেকেই আপডেট হয়।1$my_greeter $mol_view2 sub /3 <= Name $mol_string4 value? <=> name?5 <= Hello $mol_view6 sub / <= greeting \1namespace $.$$ {2 export class $my_greeter extends $.$my_greeter {3 @ $mol_mem name( next?: string ) { return next ?? '' }4 5 @ $mol_mem greeting() {6 return this.name() ? `Hello, ${ this.name() }!` : 'Type your name'7 }8 }9}

যোগ ও মুছে ফেলা যায় এমন তালিকা

সংগ্রহটিকে একটি রিয়্যাক্টিভ প্রপার্টিতে রাখুন এবং অ্যাকশন থেকে অপরিবর্তনীয়ভাবে (immutably) আবার লিখুন। কীযুক্ত Row* প্রতিটি আইটেমের জন্য একটি সারি রেন্ডার করে, আর——

ভার্চুয়ালাইজড রেন্ডারিং-এর কল্যাণে——কেবল দৃশ্যমান সারিগুলোই তৈরি হয়।1$my_todo $mol_view2 draft? \3 items /4 sub /5 <= Input $mol_string6 value? <=> draft?7 hint \New item8 <= Add $mol_button_major9 click? <=> add?10 sub / <= add_label \Add11 <= List $mol_list12 rows <= item_rows /13 Row* $mol_row14 sub /15 <= Label* $mol_view16 sub / <= item_title* \17 <= Delete* $mol_button_minor18 click? <=> delete*?19 sub / <= delete_label \✕1namespace $.$$ {2 export class $my_todo extends $.$my_todo {3 @ $mol_mem draft( next?: string ) { return next ?? '' }4 @ $mol_mem items( next?: readonly string[] ) { return next ?? [] }5 6 @ $mol_action add() {7 const title = this.draft().trim()8 if( !title ) return9 this.items([ ... this.items(), title ])10 this.draft( '' )11 }12 13 @ $mol_action delete( id: number ) {14 this.items( this.items().filter( ( _, i ) => i !== id ) )15 }16 17 item_title( id: number ) { return this.items()[ id ] }18 19 item_rows() {20 return this.items().map( ( _, id ) => this.Row( id ) )21 }22 }23}GitHub-এ এই পৃষ্ঠা সম্পাদনা করুনএটি কি সহায়ক ছিল?হ্যাঁনাপূর্ববর্তীReact, Vue ও Svelte থেকে পরবর্তীপ্লাগইনএই পৃষ্ঠায়দ্বিমুখী বাউন্ড ইনপুট যোগ ও মুছে ফেলা যায় এমন তালিকা লোডিং ও এরর স্টেট সহ ডেটা ফেচ লোকাল স্টেট পার্সিস্ট করা রুট প্যারামিটার পড়া ও লেখা স্বয়ংক্রিয় লাইট/ডার্ক থিম যোগ করা পরবর্তী