因此，查看一些關于同一主題的已回答問題，但它們都有完全不同的布局，我想知道如何為“沒有帳戶？注冊”中的“注冊”一詞設定不同的顏色，這本身就是一個按鈕.
零件：
const CustomButton = ({onPress, text, type = "PRIMARY", bgColor, fgColor, fontColor}) => {
return (
<Pressable
onPress={onPress}
style={[
styles.container,
styles[`container_${type}`],
bgColor ? {backgroundColor: bgColor} : {},
]}>
<Text
style={[
styles.text,
styles[`text_${type}`],
fgColor ? {color: fgColor} : {},
fontColor ? {color: fontColor} : {},
]}>
{text}
</Text>
</Pressable>
);
};
登錄畫面：
<CustomButton
text="Don't have an account? Register"
onPress={onSignUpPressed}
type="TERTIARY"
fontColor="#000000"
/>
uj5u.com熱心網友回復：
你可以嘗試這樣的事情：
登錄螢屏：
<CustomButton
text="Don't have an account?"
childText="Register"
onPress={onSignUpPressed}
type="TERTIARY"
fontColor="#000000"
childColor="#DDFFDD"
/>
零件：
const CustomButton = ({onPress, text, type = "PRIMARY", bgColor, fgColor, fontColor, childText, childColor}) => {
return (
<Pressable
onPress={onPress}
style={[
styles.container,
styles[`container_${type}`],
bgColor ? {backgroundColor: bgColor} : {},
]}>
<Text
style={[
styles.text,
styles[`text_${type}`],
fgColor ? {color: fgColor} : {},
fontColor ? {color: fontColor} : {},
]}>
{text}
<Text style={[styles.text,{color:childColor|| fontColor}>
{childText}
</Text>
</Text>
</Pressable>
);
};
但是您應該問自己的問題是：我會在我的應用程式中的多個地方使用此雙色按鈕功能，還是僅在我的應用程式中的這個“注冊”按鈕上使用此功能？如果這是您將要使用它的唯一地方，那么您可能不需要為此使用您的 CustomButton 組件并為此撰寫一個簡單的按鈕。如果您要多次使用此雙色功能，則可以使用我上面的簡單示例。即使您可以改進它以檢查 childText 道具是否到來，然后決定顯示第二個文本組件。
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/515818.html
標籤：反应式按钮文本颜色
上一篇：如何使Widget可點擊？