ক্লিক করুন রিঅ্যাক্টজেএস-এ একাধিক ফাংশন

Question

আমি ভ্যানিলা জেএসে জানি, আমরা করতে পারি

onclick="f1();f2()"

রিঅ্যাক্টজেএস-এ ক্লিক করে দুটি ফাংশন কল করার সমতুল্য কী হবে?

আমি জানি একটি ফাংশন কল করা এইরকম:

onClick={f1}

Comments

খুব সহজ: একটি ফাংশন পাস করুন যা দুটি ফাংশনকে কল করে, যেমন আপনি যেমন করতে চান ele.onclick = ...বা করতে চান addEventListener।

— ফেলিক্স ক্লিং

ক্ষেত্রে আপনার 1 ম ফাংশন setState হয় এবং আপনি নিশ্চিত এই ঘটছে / 2nd ফাংশন রানে আগে বিবেচনায় নেয়া, আপনি কি এই পোস্টটি বেশ সহায়ক খুঁজে হবে প্রয়োজন: medium.com/better-programming/...

— Nasia Makrygianni

Answer 1

অন্য দুটি ফাংশন / পদ্ধতিতে আপনার দুটি + ফাংশন কলগুলি মোড়ানো। এখানে সেই ধারণার কয়েকটি রূপ রয়েছে:

1) পৃথক পদ্ধতি

var Test = React.createClass({
   onClick: function(event){
      func1();
      func2();
   },
   render: function(){
      return (
         <a href="#" onClick={this.onClick}>Test Link</a>
      );
   }
});

বা ES6 ক্লাস সহ:

class Test extends React.Component {
   onClick(event) {
      func1();
      func2();
   }
   render() {
      return (
         <a href="#" onClick={this.onClick}>Test Link</a>
      );
   }
}

2) ইনলাইন

<a href="#" onClick={function(event){ func1(); func2()}}>Test Link</a>

বা ES6 সমতুল্য:

<a href="#" onClick={() => { func1(); func2();}}>Test Link</a>

Comments

বা কম অনুকূল:onclick={function() { f1(); f2(); }}

— ফেলিক্স ক্লিং

বা ES6 এonclick={()=>{ f1(); f2() }}

— আলেজান্দ্রো সিলভা

বা সিজেএসএক্সে:onClick={ () => f1(); f2() }

— ভাদোরাকোয়েস্ট

প্রথমটি যদি অ্যাসিক্রোনাস হয় তবে .. আমি চাই যে প্রথমটি সফলভাবে শেষ হওয়ার পরে কেবল দ্বিতীয়টি কার্যকর করা হবে

— রত্নব কুমার রায়

@ রত্নভূকুমারই এটি সম্পূর্ণ অন্য উদ্বেগ যা প্রতিক্রিয়া সম্পর্কিত নয়। এটি জেএস-এ অ্যাসিঙ্ক সম্পর্কিত সমস্ত বিষয় এবং Promisesসম্ভবত আপনি যে উত্তরটি খুঁজছিলেন তা

— এমিল বার্গারন

Answer 2

হতে পারে আপনি তীর ফাংশন (ES6 +) বা সাধারণ পুরানো ফাংশন ঘোষণাটি ব্যবহার করতে পারেন।

সাধারণ ফাংশন ঘোষণার প্রকার ( ES6 + নয় ):

<link href="#" onClick={function(event){ func1(event); func2();}}>Trigger here</link>

বেনামে ফাংশন বা তীর ফাংশন প্রকার ( ES6 + )

<link href="#" onClick={(event) => { func1(event); func2();}}>Trigger here</link>

দ্বিতীয়টি হ'ল সংক্ষিপ্ততম রাস্তা যা আমি জানি। আশা করি এটি আপনাকে সাহায্য করবে!

Answer 3

যে কোনও উপাদানটির জন্য অনক্লিকটিতে একাধিক ফাংশন কল করা, আপনি একটি মোড়ক ফাংশন তৈরি করতে পারেন, এরকম কিছু।

wrapperFunction = () => {
    //do something
    function 1();
    //do something
    function 2();
    //do something
    function 3();
}

এই ফাংশনগুলি প্যারেন্ট ক্লাসে একটি পদ্ধতি হিসাবে সংজ্ঞায়িত করা যায় এবং তারপরে র‌্যাপার ফাংশন থেকে ডাকা হয়।

আপনার কাছে মূল উপাদান থাকতে পারে যা এইভাবে অন চেঞ্জের কারণ ঘটবে,

<a href='#' onClick={this.wrapperFunction}>Some Link</a>

Answer 4

এই onclick={()=>{ f1(); f2() }}আমাকে অনেক সাহায্য করেছে যদি আমি একই সময়ে দুটি ভিন্ন ফাংশন চাই। তবে এখন আমি কেবল একটি বোতাম দিয়ে একটি অডিওরেকর্ডার তৈরি করতে চাই। সুতরাং আমি যদি প্রথম ক্লিক করি তবে আমি স্টার্টফানশনটি চালাতে চাই f1()এবং যদি আমি আবার ক্লিক করি তবে আমি স্টপফানশনটি চালাতে চাই f2()।

তোমরা কীভাবে বুঝতে পার?

Comments

জেনারেটরের সাথে ফাংশন সম্পর্কে ওয়াহট? আপনি কোনও ভেরিয়েবলের সাথে সিদ্ধান্ত নিতে পারেন যা তার পরে ফাংশন রয়েছে এমন অবস্থার ভিতরে পরিবর্তিত হয়, তারপরে আপনি যে ফাংশনটি ফলনের সাথে চান তা কল করেন

— নিকোলাস ফ্রেইটাস মিঃ নিক

const play = () => { console.log("played"); } const pause = () => { console.log("paused"); } function* audioSwitcher() { let paused = true; while (true) { if(paused) { play(); } else { pause(); } yield paused = !paused; } }

— নিকোলাস ফ্রেইটাস মিঃ নিক

Answer 5

আপনি নেস্টেড ব্যবহার করতে পারেন।

এখানে দুটি ফাংশন রয়েছে একটি openTab()এবং অন্যটি হ'ল closeMobileMenue()প্রথমে আমরা কল করি openTab()এবং ভিতরে অন্য ফাংশনটি কল করি closeMobileMenue()।

function openTab() {
    window.open('https://play.google.com/store/apps/details?id=com.drishya');
    closeMobileMenue()   //After open new tab, Nav Menue will close.  
}

onClick={openTab}