React-native-router-flux: ํƒ์ƒ‰ ํ‘œ์‹œ์ค„ backButtonImage - ์ด๋ฏธ์ง€๊ฐ€ ์žˆ๋Š” ๊ฒฝ์šฐ ๋Œ€์‹  ์•„์ด์ฝ˜์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๊นŒ?

์— ๋งŒ๋“  2016๋…„ 09์›” 06์ผ  ยท  3์ฝ”๋ฉ˜ํŠธ  ยท  ์ถœ์ฒ˜: aksonov/react-native-router-flux

์•ˆ๋…•,

ํƒ์ƒ‰ ๋ชจ์Œ backButtonImage์˜ ์ด๋ฏธ์ง€ ๋Œ€์‹  Icon(react-native-vector-icons)์„ ์‚ฌ์šฉํ•˜๊ณ  ์‹ถ์—ˆ์Šต๋‹ˆ๋‹ค. ์ด ๋ฐฉ๋ฒ•์„ ์‹œ๋„ํ•œ ์‚ฌ๋žŒ์ด ์žˆ๊ฑฐ๋‚˜ ๋™์ผํ•œ ๋™์ž‘์œผ๋กœ ์ด๋ฅผ ์ˆ˜ํ–‰ํ•  ์ˆ˜ ์žˆ๋Š” ๋‹ค๋ฅธ ๋ฐฉ๋ฒ•์ด ์žˆ์Šต๋‹ˆ๋‹ค.
๋ฏธ๋ฆฌ ๊ฐ์‚ฌ๋“œ๋ฆฝ๋‹ˆ๋‹ค.

๊ฐ€์žฅ ์œ ์šฉํ•œ ๋Œ“๊ธ€

const ionicon = (icon) => Platform.OS == 'ios' ? `ios-${icon}` : `md-${icon}`;
renderBackButton={(nav) => {
    return nav.navigationState.index ? (
        <TouchableOpacity onPress={Actions.pop}>
            <Icon name={ionicon('arrow-back')} size={26} color='#FFFFFF' />
        </TouchableOpacity>
    ) : null;
}}

๋ชจ๋“  3 ๋Œ“๊ธ€

const ionicon = (icon) => Platform.OS == 'ios' ? `ios-${icon}` : `md-${icon}`;
renderBackButton={(nav) => {
    return nav.navigationState.index ? (
        <TouchableOpacity onPress={Actions.pop}>
            <Icon name={ionicon('arrow-back')} size={26} color='#FFFFFF' />
        </TouchableOpacity>
    ) : null;
}}

๋ฃจํŠธ ์”ฌ์— renderBackButton ๊ฐ€ ์žˆ์„ ๋•Œ๋Š” ์ž‘๋™ํ•˜์ง€ ์•Š์•˜์Šต๋‹ˆ๋‹ค.
๊ทธ๋Ÿฌ๋‚˜ ๊ฐœ๋ณ„ ์žฅ๋ฉด์— ๋„ฃ์œผ๋ฉด ์›ํ™œํ•˜๊ฒŒ ์ž‘๋™ํ•ฉ๋‹ˆ๋‹ค.

์ด ํŽ˜์ด์ง€๊ฐ€ ๋„์›€์ด ๋˜์—ˆ๋‚˜์š”?
0 / 5 - 0 ๋“ฑ๊ธ‰