getTheme()本机基本类型

n

我正在使用Native Base此链接中所述的自定义样式主题。

https://docs.nativebase.io/Customize.html#theaming-nb-headref导入:

import material from './native-base-theme/variables/material';
import getTheme from './native-base-theme/components';
return (
    <Suspense fallback="loading">
      <Provider store={store}>
        <StyleProvider style={getTheme(material)}>

在getTheme()里面,在上material,出现此TypeScript错误:

类型'{{platformStyle:string; 平台:“ ios” | “ android” | “窗户” | “ macos” | “网络”;headerStyle:字符串; iconStyle:字符串;contentStyle:字符串;ExpandedIconStyle:字符串;手风琴边框颜色:字符串; ...更多151 ...; 插图:{...; }; }'不可分配给'{platformStyle:any; 平台:“ ios” | “ android” | “窗户” | “ macos” | “网络”;手风琴边框颜色:字符串; AccordionContentPadding:数字;AccordionIconFontSize:数字;contentStyle:字符串;...还有180个... 插图:{...; }; }'。键入'{platformStyle:string; 平台:“ ios” | “ android” | “窗户” | “ macos” | “网络”;headerStyle:字符串; iconStyle:字符串;contentStyle:字符串;ExpandedIconStyle:字符串;手风琴边框颜色:字符串; ...更多151 ...; 插图:{...; }; }”缺少类型“ {{platformStyle:any; 平台:“ ios” | “ android”

我该如何摆脱呢?

在native-base-themes文件夹中,有一个material.js文件,看起来像这样:

import color from 'color';
import { Platform, Dimensions, PixelRatio } from 'react-native';

import { PLATFORM } from './commonColor';

const deviceHeight = Dimensions.get('window').height;
const deviceWidth = Dimensions.get('window').width;
const platform = Platform.OS;
const platformStyle = PLATFORM.MATERIAL;
const isIphoneX =
  platform === PLATFORM.IOS &&
  (deviceHeight === 812 ||
    deviceWidth === 812 ||
    deviceHeight === 896 ||
    deviceWidth === 896);

export default {
  platformStyle,
  platform,

  // Android
  androidRipple: true,
  androidRippleColor: 'rgba(256, 256, 256, 0.3)',
  androidRippleColorDark: 'rgba(0, 0, 0, 0.15)',
  buttonUppercaseAndroidText: true,
  // Button
  buttonFontFamily: 'Roboto',
  get buttonPrimaryBg() {
    return this.brandPrimary;
  },
  get buttonTextSizeLarge() {
    return this.fontSizeBase * 1.5;
  },

  // Header
  toolbarBtnColor: '#fff',
  toolbarDefaultBg: '#3F51B5',
  toolbarHeight: 56,
  toolbarSearchIconSize: 23,
  toolbarInputColor: '#fff',
  searchBarHeight: platform === PLATFORM.IOS ? 30 : 40,
  searchBarInputHeight: platform === PLATFORM.IOS ? 40 : 50,
  toolbarBtnTextColor: '#fff',
  toolbarDefaultBorder: '#3F51B5',
  iosStatusbar: 'light-content',
  get statusBarColor() {
    return color(this.toolbarDefaultBg)
      .darken(0.2)
      .hex();
  },
  get darkenHeader() {
    return color(this.tabBgColor)
      .darken(0.03)
      .hex();
  },

  // Text
  textColor: '#000',
  inverseTextColor: '#fff',
  noteFontSize: 14,
  get defaultTextColor() {
    return this.textColor;
  },

  // iPhoneX SafeArea
  Inset: {
    portrait: {
      topInset: 24,
      leftInset: 0,
      rightInset: 0,
      bottomInset: 34,
    },
    landscape: {
      topInset: 0,
      leftInset: 44,
      rightInset: 44,
      bottomInset: 21,
    },
  },
};
安洛里奇
  1. 要快速摆脱这种情况,您可以简单地使用any如下类型:

    <StyleProvider style={getTheme(commonColor as any)}>

  2. 为了正确解决此问题,您必须研究这两个文件。

  • native-base-theme/variables/platform.js
  • native-base-theme/variables/commonColor.js

getTheme从中的参数(颜色)的类型是根据中的默认导出变量推断出来的platform.js您得到的错误意味着这两个文件中的默认导出变量不匹配。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章