node.js - React Native 应用程序中出现错误 "undefined is not an object"

Question

关闭。此题需要 details or clarity 。目前不接受答案。

---

想要改进这个问题吗？通过 editing this post 添加详细信息并澄清问题.

已关闭 5 年前。

Improve this question

我是 React Native 和 Expo XDE 的新手，我正在 arrayOf 类型的文件 TaskList.js 中实现 PropTypes，但在编译应用程序时，我收到一条错误，指示“未定义不是一个对象(评估 'react3.default.PropTypes.arrayOf ')”，即使我添加另一个 String 类型的 PropTypes 或另一个相同的事情也会发生。

如何使用 PropTypes 解决这个问题？

错误

package.json

{
  "name": "test",
  "version": "0.1.0",
  "private": true,
  "devDependencies": {
    "react-native-scripts": "1.11.1",
    "jest-expo": "25.0.0",
    "react-test-renderer": "16.2.0"
  },
  "main": "./node_modules/react-native-scripts/build/bin/crna-entry.js",
  "scripts": {
  "start": "react-native-scripts start",
  "eject": "react-native-scripts eject",
  "android": "react-native-scripts android",
  "ios": "react-native-scripts ios",
  "test": "node node_modules/jest/bin/jest.js"
  },
  "jest": {
    "preset": "jest-expo"
  },
  "dependencies": {
    "expo": "^25.0.0",
    "react": "16.2.0",
    "react-native": "0.52.0"
  }
}

App.js

import React from 'react';
import { StyleSheet, Text, View, ListView } from 'react-native';
import TaskList from './TaskList';

export default class App extends React.Component {
  constructor(props, context){
    super(props, context);

    this.state = {
      todos:[
        {
          task : "Learn React Native"
        },
        {
          task : "Learn Redux"
        },
     ]
    }

  }

  render() {
    return (
      <View style={styles.container}>
        <TaskList todos={this.state.todos}/>
     </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

TaskList.js

import React, {Component, PropTypes} from 'react';
import {View, Text, Button, ListView} from 'react-native';

class TaskList extends React.Component {
  constructor(props, context){
    super(props, context);

    const ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !==   r2});

    this.state = {
      dataSource: ds.cloneWithRows(props.todos),
    }

  }

  renderRow =(todo)=>{
    return(
      <Text>{todo.task}</Text>
    )
  }

  render(){
    return(
      <View>
        <ListView
          dataSource={this.state.dataSource}
          key={this.props.todos}
          renderRow={this.renderRow.bind(this)}
        />
      </View>
   )
  }
}

TaskList.propTypes = {
  todos: React.PropTypes.arrayOf(React.PropTypes.object).isRequired,
}

export default TaskList;

Answer 1

PropTypes 已移入其单独的 NPM 包 (v15+)，prop-types并且不再存在于 React 包中。这就是为什么它被报告为未定义。安装并导入:

import PropTypes from 'prop-types';