React Hooks

Hooks များကို React ဗားရှင်း 16.8 တွင် ထည့်သွင်းထားသည်။

Hooks သည် လုပ်ဆောင်ချက် အစိတ်အပိုင်းများကို ပြည်နယ်နှင့် အခြား React အင်္ဂါရပ်များသို့ ဝင်ရောက်ခွင့် ပြုသည်။ ထို့အတွက်ကြောင့်၊ class အစိတ်အပိုင်းများကို ယေဘုယျအားဖြင့် မလိုအပ်တော့ပါ။

Hook ဆိုတာဘာလဲ။

Hooks သည် ကျွန်ုပ်တို့အား နိုင်ငံတော်နှင့် ဘဝသံသရာနည်းလမ်းများကဲ့သို့သော React အင်္ဂါရပ်များတွင် "ချိတ်" နိုင်စေပါသည်။

import React, { useState } from "react";
import ReactDOM from "react-dom";

function FavoriteColor() {
  const [color, setColor] = useState("red");

  return (
    <>
      <h1>My favorite color is {color}!</h1>
      <button
        type="button"
        onClick={() => setColor("blue")}
      >Blue</button>
      <button
        type="button"
        onClick={() => setColor("red")}
      >Red</button>
      <button
        type="button"
        onClick={() => setColor("pink")}
      >Pink</button>
      <button
        type="button"
        onClick={() => setColor("green")}
      >Green</button>
    </>
  );
}

ReactDOM.render(<FavoriteColor />, document.getElementById('root'));

importHooks တွေကနေ လုပ်ရမယ် react။

ဤနေရာတွင် useStateကျွန်ုပ်တို့သည် အပလီကေးရှင်းအခြေအနေအား ခြေရာခံရန် Hook ကိုအသုံးပြုနေပါသည်။

State သည် ယေဘူယျအားဖြင့် ခြေရာခံရန် လိုအပ်သော အပလီကေးရှင်းဒေတာ သို့မဟုတ် ဂုဏ်သတ္တိများကို ရည်ညွှန်းသည်။

ချိတ်စည်းကမ်းများ

ချိတ်များအတွက် စည်းမျဉ်း 3 ခုရှိသည်။

• Hooks များကို React function အစိတ်အပိုင်းများအတွင်းသာ ခေါ်နိုင်သည်။
• အစိတ်အပိုင်းတစ်ခု၏ ထိပ်တန်းအဆင့်တွင်သာ Hooks ဟုခေါ်နိုင်သည်။
• ချိတ်များသည် အခြေအနေအရ မဖြစ်နိုင်ပါ။

စိတ်ကြိုက်ချိတ်

သင့်တွင် အစိတ်အပိုင်းများစွာတွင် ပြန်လည်အသုံးပြုရန် လိုအပ်သော ယုတ္တိရှိရှိ ယုတ္တိရှိပါက၊ သင်သည် သင့်စိတ်ကြိုက် Hooks များကို တည်ဆောက်နိုင်ပါသည်။

ကျွန်ုပ်တို့သည် Custom Hooks ကဏ္ဍတွင် ပိုမိုအသေးစိတ် ဖော်ပြပါမည် ။