使用 NeomorphFlex 时，无法读取未定义的属性“匹配”错误

Question

我需要在 NeomorthFlex 中使用超过 1 种样式（来自react-native-neomorph-shadows），我正在这样做：

const styleuse = [
    globalStyles.buttonContained,
    {
      backgroundColor: useColor,
      padding: usePadding,
      width: fillContent ? undefined : "100%",
      shadowRadius: 5
    },
    style,
  ] as ViewStyle

  return (
          
      <Pressable
        onPress={disabled ? undefined : onPress}

        {...props}
      >
        <NeomorphFlex
          swapShadows // Troca as sombras internas e externas
          style={styleuse}>
        {prefixIcon ? (
          <IconStyled
            icon={prefixIcon}
            color={props.prefixIconColor ? props.prefixIconColor : "primary"}
          />
        ) : null}
        
          <View style={{ flexShrink: 1 }}>{children}</View>        
        {suffixIcon ? (
          <IconStyled
            icon={suffixIcon}
            color={props.suffixIconColor ? props.suffixIconColor : "primary"}
          />
        ) : null}
        </NeomorphFlex>
      </Pressable>
      
  );

我看到了另一个与我类似的问题，但该人说它可以通过从样式中删除 [] 来实现，但就我而言，我不能这样做，因为我需要使用 props 样式、默认 Button 样式和具体风格。如果没有[]，这是不可能的。有人可以帮助我吗？

（另一个问题的链接：https://github.com/tokkozhin/react-native-neomorph-shadows/issues/66）

Answer 1

它可以创建

StyleSheet

并使用

...

来组合样式

const styleSheet = StyleSheet.create({
    button: {
      ...globalStyles.buttonContained,
      ...(style as object),
      backgroundColor: useColor,
      padding: usePadding,
      width: fillContent ? undefined : "100%",
      shadowRadius: 5,
    }
  })

  return (
          
      <Pressable
        onPress={disabled ? undefined : onPress}

        {...props}
      >
        <NeomorphFlex
          swapShadows
          style={styleSheet.button}>
        {prefixIcon ? (
          <IconStyled
            icon={prefixIcon}
            color={props.prefixIconColor ? props.prefixIconColor : "primary"}
          />
        ) : null}
        
          {children}        
        {suffixIcon ? (
          <IconStyled
            icon={suffixIcon}
            color={props.suffixIconColor ? props.suffixIconColor : "primary"}
          />
        ) : null}
        </NeomorphFlex>
      </Pressable>
      
  );
}