Question

我正在将代码从React Native v0.49手动迁移到v0.59。当我运行应用程序时，出现未定义错误不是对象（评估'_react.default.PropTypes.bool'）。我在这个项目中使用打字稿。 FieldValidation.tsx中有一些内容。

import * as React from 'react';
import { View, Text } from 'react-native';
import { Row, Col } from 'native-base';
import { themeService } from '../../Core/Services';

import Icon from 'react-native-vector-icons/MaterialIcons';
import IconLine from 'react-native-vector-icons/SimpleLineIcons';

import {
  ModalPicker,
  DatePicker,
  InputLabel,
  Input,
  InputBordered,
  CustomerPicker
} from '../Components';

export default class FieldValidationComponent extends React.Component<any, any> {

render() {
    const { meta: { touched, error } } = this.props;
    switch (this.props.caseType) {
    case 'inline_boxed_date': {
    return (
      <View style={{ flex: 1, flexDirection: 'column' }}>
        <View style={{ flexDirection: 'row' }}>
          <View style={[this.globalTheme.get('middleV'), { flex: 1 }]}> // Line 300
            {this.props.label}
          </View>
          <View style={[touched && error ? this.formTheme.get('boxedRed') : this.formTheme.get('boxed'), { flex: 1 }]}>
            <DatePicker {...this.props} />
          </View>
        </View>
        {touched && error &&
          <View style={{ flexDirection: 'row', paddingTop: 5 }}>
            <View style={[this.globalTheme.get('middleV'), { flex: 1 }]}>
                  {null}
                </View>
                <View style={[this.globalTheme.get('middleH'), { flexDirection: 'row', flex: 1 }]}>
                  <Icon name='error-outline' size={16} style={{ paddingRight: 10, color: '#db5454' }} />
                  <Text style={[
                    this.globalTheme.get('textRegular'),
                    { color: '#db5454', fontSize: 12 }
                  ]}>{error}</Text>
                </View>
              </View>
            }
          </View>
        );
      }
        case 'custom_shippingCharge': {
        return (
          <View style={{ flex: 1, flexDirection: 'column' }}>
            <Row>
              <Col size={50} style={[this.globalTheme.get('middleV')]}> //Line 373
                {this.props.label}
              </Col>
              <Col size={38} style={[touched && error ? this.formTheme.get('boxedRed') : this.formTheme.get('boxed')]}>
                <View style={{ flex: 1 }}>
                  <Input {...this.props} />
                </View>
              </Col>
              <Col size={2} />
              <Col size={10}>
                <View style={[this.globalTheme.get('middleV'), { flex: 1 }]}>
                  {this.props.button}
                </View>
              </Col>
            </Row>
            {touched && error &&
              <View style={{ flexDirection: 'row', paddingTop: 5 }}>
                <View style={[this.globalTheme.get('middleV'), { flex: 1 }]}>
                  {null}
                </View>
                <View style={[this.globalTheme.get('middleH'), { flexDirection: 'row', flex: 1 }]}>
                  <Icon name='error-outline' size={16} style={{ paddingRight: 10, color: '#db5454' }} />
                  <Text style={[
                this.globalTheme.get('textRegular'),
                { color: '#db5454', fontSize: 12 }
              ]}>{error}</Text>
                </View>
              </View>
        }
      </View>
    );
  }
    }
}

也许有人可以帮助我解释此错误的含义以及造成该错误的原因，或者就如何将本机项目（在代码中使用打字稿）从0.49版本升级到最新版本的方法提供建议。非常感谢您。

Answer 1

Proptypes have been removed from React Native starting at React Native 0.47。您正在使用0.49，它应该已经给您带来错误，但是也许您之前没有迁移过React？

无论如何，您的一个或多个组件似乎正在使用PropTypes。看来问题不在于FieldValidation.tsx本身；它可能在该文件使用的组件之一上，包括第三方组件（在node_modules中）。

您需要更新组件以使用proper generic types for props，或者（不建议这样做）重新添加PropTypes库并进行引用。

将代码从React Native 0.49迁移到0.59后，出现错误'_react.default.PropTypes.bool'

1 个答案: