在withStyles函数(react-native-ui-kitten)之外访问主题变量

时间:2019-10-08 21:08:14

标签: react-native-ui-kitten

我想使用主题变量来相应地设置图标样式。但是我不能使用style属性来填充react-native-ui-kitten的Icon元素,而是必须使用fill属性。如何在react-native-ui-kitten的withStyles函数之外访问主题变量

2 个答案:

答案 0 :(得分:0)

我不太确定我是否完全理解您的问题。通常,当您有问题时,应发布一些代码以获取上下文。

这是我的回答,假设“主题变量”为哈希...尝试字符串插值:

fill={`${theme.HEX_COLOR}`}

答案 1 :(得分:0)

@ xk2tm5ah5c 如果将组件包装到theme中,则可以使用withStyles属性。

这是示例代码:

import React from 'react';
import { View } from 'react-native';
import { Button, Icon, withStyles } from 'react-native-ui-kitten';

const ScreenComponent = (props) => {

  const iconColor = props.theme['color-primary-default'];

  const FacebookIcon = (style) => (
    <Icon {...style} fill={iconColor} name='facebook' />
  );

  return (
    <View>
      <Button icon={FacebookIcon}>LOGIN WITH FACEBOOK</Button>
    </View>
  );
};

export const Screen = withStyles(ScreenComponent);