所以這是組件:
<ReusedHeader
H1headerGray="text... "
H2headerRed="text2 ! "
pheader="p1"
getStarted="button text1"
hrefab="button url 1"
whatWeDo="button text2"
hrefbb="button url 2"
imageSrc="image url"
/>;
組件中的串列:
<li className=" hover:ring active:ring-4 w-full flex items-center justify-center px-8 py-3 border border-transparent text-base font-medium rounded-md text-white bg-red-600 hover:bg-red-700 md:py-4 md:text-lg md:px-10">
{getStarted}
</li>
而這個組件我會在很多地方用到;在某些地方,我想要沒有按鈕的組件;
如果可能,如何啟用和禁用按鈕?
uj5u.com熱心網友回復:
您可以只傳遞所需的道具并處理組件內的邏輯
const ReusedHeader = ({buttonsEnabled=true}) => {
if(buttonsEnabled){ // return something }
else { // return something else }
}
或者,如果您想要沒有 onClick 功能的相同標記,請修改 onClick。
onClick={buttonsEnabled? onClick : undefined}
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/386195.html
標籤:javascript 反应 下一个.js 顺风-css
上一篇:占位符文本輸入不顯示(反應原生)
