تعریف کامپوننت به روش تابعی یا functional component (قسمت یازدهم)

کامپوننت ها به دو روش قابل پیاده سازی هستند:

• تعریف کامپوننت بصورت تابع
• تعریف کامپوننت بصورت کلاس

برای مشاهده نمونه کامپوننت تابعی به فایل app.js بروید این فایل تابعی به نام app دارد که مقداری را بصورت دستورات jsx برگشت یا return میکند.

نمونه:

function App() {
  return (
    <div className=&quotApp&quot>
      <header className=&quotApp-header&quot>
        <img src={logo} className=&quotApp-logo&quot alt=&quotlogo&quot />
        <p>
          Edit <code>src/App.js</code> and save to reload.
        </p>
        <a
          className=&quotApp-link&quot
          href=&quothttps://reactjs.org&quot
          target=&quot_blank&quot
          rel=&quotnoopener noreferrer&quot
        >
          Learn React
        </a>
      </header>
    </div>
  );
}

در انتهای فایل نیز تابع موردنظر که یک مقدار آبجکت برگشت داده شده است بصورت default export گرفته شده است.

مشاهده ادامه در لینک زیر:

https://dejavan.ir

سخن پایانی

این بود یکی دیگر از آموزش react در صورت داشتن سوال یا نظر اون رو با من در میان بزارید.

من امیر جوان میر هستم گرافیست و توسعه دهنده وب از سال 1390

instagram: https://www.instagram.com/amir.javanmir/

تمامی حقوق این مطلب متعلق به سایت دیزاینر جوان می باشد هرگونه استفاده از این مطلب با ذکر منبع آن بلامانع است.

website: https://dejavan.ir
instagram: https://instagram.com/designer.javan
twitter: https://twitter.com/designer_javan
Telegram: https://t.me/designer_javan

سایر مطالب