如何修复声明动态样式时React Native中的“不是函数”错误

n6lpvg4x 于 2023-01-21 发布在 React

关注(0)|答案(1)|浏览(103)

我正在遵循一个教程，我目前有这个代码，我试图改变一个基于属性的背景颜色...这是它看起来像什么

import React from 'react';
import { View, Text, StyleSheet } from 'react-native';

const SomeComponent = ({ bgColor }) => (
  <View style={styles.wrapper(bgColor)}>
    <Text style={styles.text}>3333</Text>
  </View>
);

const styles = StyleSheet.create({
  wrapper: color => ({
    flex: 1,
    backgroundColor: color,
  }),
  text: {
    color: 'red',
  },
});

我一直收到styles.wrapper is not a function
我该怎么解决这个问题？

react-native

来源：https://stackoverflow.com/questions/70542060/how-to-fix-not-a-function-error-from-react-native-while-declaring-dynamic-styl

1条答案

按热度按时间

f8rj6qna1#

不能像以前那样声明StyleSheet函数。
或者，您可以声明一个JS函数，根据您传递的参数传递具有不同颜色的相同样式。
您可以按如下方式执行此操作：

import React from 'react';
import { View, Text, StyleSheet } from 'react-native';

const myStyle = (color) => {
    return {
        flex: 1,
        backgroundColor: color,
    }
};

const SomeComponent = ({ bgColor }) => {
    <View style={this.myStyle(bgColor)}>
        <Text style={styles.text}>3333</Text>
    </View>
};

const styles = StyleSheet.create({
    text: {
        color: 'red',
    },
});

赞(0）回复(0）举报 2023-01-21

我来回答

如何修复声明动态样式时React Native中的“不是函数”错误

1条答案

相关问题

热门标签

最新问答