React native elements error: Invariant Violation: Element type is invalid

Question

我正在尝试使用来自 react-native-elements 的 FormValidationMessage。我不明白我做错了什么。我收到错误：

Invariant Violation: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

我导入就像 docs:

import { Input, Button, FormValidationMessage } from 'react-native-elements';

我使用它的函数：

showLoginError() {
    console.log(this.props.error); //I can log the correct error here
    if (this.props.error) {
      return(
        <FormValidationMessage>{this.props.error}</FormValidationMessage>
      )
    }
}

我是直接在render中这样调用这个函数

<View style={{width: 250}}>
   {this.showLoginError()}
</View>

我在网上找遍了，但似乎没有明确的解决方案。

Answer 1

在我的例子中（使用 Webpack），区别在于：

import {MyComponent} from '../components/xyz.js';

对

import MyComponent from '../components/xyz.js';

第二个有效，而第一个导致错误。

Answer 2

在没有错误的情况下，你需要让你的函数return为null。

showLoginError() {
  console.log(this.props.error); //I can log the correct error here
  if (this.props.error) {
    return(
      <FormValidationMessage>{this.props.error}</FormValidationMessage>
    )
  } else {
    return null;
  }
}

Answer 3

看起来他们在最新版本中将组件从代码库中删除了。

https://github.com/react-native-training/react-native-elements/blob/c668c78dddd9315f6ca5ec2548e051b2a7e29c73/website/blog/2019-01-27-1.0-release.md#form

React native elements error: Invariant Violation: Element type is invalid

React native elements error: Invariant Violation: Element type is invalid

reactjs

react-native

react-props