- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
好吧,这段代码在控制台中抛出一个错误 - “PropTypes 未定义”,因此应用程序不会呈现。您知道配置甚至代码有什么问题吗?顺便说一句,如果重要的话我不会使用 eslint。
import React, { Component } from 'react';
import PropTypes from 'prop-types';
export default class Movie extends Component {
static propTypes = {
movie: Proptypes.shape({
title: Proptypes.string.isRequired
})
};
static defaultProps = {
description: 'Description is not available'
}
render() {
return (
<div>
<h3>{this.props.movie.title}</h3>
</div>
)
}
}
但是这按预期工作(在组件之后):
Movie.propTypes = {
movie: PropTypes.shape({
title: PropTypes.string.isRequired
})
}
package.json配置:
{
"dependencies": {
"babel-polyfill": "^6.26.0",
"live-server": "^1.2.0",
"normalize.css": "^8.0.0",
"prop-types": "^15.6.1",
"react": "^16.2.0",
"react-dom": "^16.2.0",
"react-router-dom": "^4.2.2",
"redux": "^3.7.2"
},
"devDependencies": {
"babel-cli": "^6.26.0",
"babel-core": "^6.26.0",
"babel-loader": "^7.1.4",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-preset-env": "^1.6.1",
"babel-preset-react": "^6.24.1",
"babel-preset-stage-0": "^6.24.1",
"css-loader": "^0.28.11",
"node-sass": "^4.8.3",
"sass-loader": "^6.0.7",
"style-loader": "^0.20.3",
"webpack": "^4.3.0",
"webpack-cli": "^2.0.13"
}
}
.babelrc配置:
{
"presets": [
"env",
"react",
"stage-0"
],
"plugins": [
"transform-class-properties"
]
}
webpack.config.js
const path = require('path');
module.exports = {
entry: ['babel-polyfill','./src/app.js'],
output: {
path: path.join(__dirname, 'public'),
filename: 'bundle.js'
},
module: {
rules: [{
loader: 'babel-loader',
test: /\.js$/,
exclude: /node_modules/,
query: {
presets: ['react', 'env', 'stage-3', 'stage-2', 'stage-1', 'stage-0']
}
}, {
test: /\.s?css$/,
use: [
'style-loader',
'css-loader',
'sass-loader'
]
}]
},
devtool: 'cheap-module-eval-source-map',
devServer: {
contentBase: path.join(__dirname, 'public'),
historyApiFallback: true
}
};
最佳答案
您这里有一个拼写错误:-
static propTypes = {
movie: Proptypes.shape({
title: Proptypes.string.isRequired
})
};
应该是:-
static propTypes = {
movie: PropTypes.shape({
title: PropTypes.string.isRequired
})
};
关于javascript - React 中出现错误 "PropTypes is not defined",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49761473/
考虑一下: import PropTypes from 'prop-types'; [...] Component.propTypes = { someProp: PropTypes.array,
请不要在完全阅读之前关闭此问题。这听起来像是一个可以主要由一个人的意见来回答的问题。但是为什么会有两种 PropTypes 的实现呢?哪一个是首选? 一种方法是使用 static 关键字并定义我们的
有什么区别 PropTypes.exact({ name: PropTypes.string, age: PropTypes.number }) 对比 PropTypes.shape({
我正在尝试创建一个自定义 PropType 来检查数组是否具有数值且长度为 2(并且对数字的排序有一些限制)。 显然,我可以为前两个约束执行 Array.PropType.arrayOf(Array.
我正在尝试使用单个 PropTypes 定义来在多个组件中重用它,但遇到了问题。我在单独的类中定义静态 propTypes,然后将其作为模块导入。比如说,我有一个 View 的 React 组件: i
// Anything that can be rendered: numbers, strings, elements or an array // (or fragment) containing
我在单独的文件中创建了两个模型 State 和 City。该州的进口城市。 State 中可以包含一系列城市。 下面的代码工作正常。 State.js let State = PropTypes.sh
删除并重新安装我的 node_modules 文件夹后,我在 LayoutPropTypes.js 文件中遇到了一个我不明白的问题。 在node_modules/react-native/Librar
我有一个组件,它接收其大小的 Prop 。 prop 可以是字符串或数字,例如:"LARGE" 或 17。 我可以让 React.PropTypes 知道这可以是 propTypes 验证中的其中之一
我想集中可能包含不同属性并且需要或不需要的属性类型。举个例子: 组件 A 具有: roomData: PropTypes.shape({ roomId: PropTypes.number, r
更新节点模块后,我在运行的 React 16 应用程序中使用 prop-types 库时遇到了错误。 我创建了一个新的React 16 create-react-app项目来检查这个问题,并且错误以同
我可以在容器组件中使用 PropTypes 吗? 通常,在容器组件中,我连接到 redux 存储并获取自己的数据,但有时我想从父组件传递额外的 props。在这种情况下,我想确保使用 PropType
我正在尝试一些 react native 代码。 根据此blog中给出的说明为我的组件添加了 Prop . 最终出现错误,找不到变量:PropTypes在 github 中发现同样的问题但没有任何答复
我正在使用 eslint 的 Airbnb 配置,它给了我这个警告: [eslint] Prop 验证中缺少“isLoading”(react/prop-types) 有没有办法为isLoading设
我正在设置一个新的 React 在: Create React App 的帮助下 但是,我遇到了 linting 问题。我收到以下 linting 错误 'PropTypes' 未定义。 (无unde
React 有很多使用 PropTypes 来检查 prop 值的方法。我常用的一种是 React.PropTypes.shape({...})。然而,我最近遇到了一种情况,我有一个对象,里面有动态键
我正在尝试 react 样板。它配备了一些发电机。 当我生成一个新容器并将所有选项都勾选为"is"时... ? Select the base component type: React.Compon
我正在 React 中编写一个小型 Toolbar 组件。下面是它的使用方法: 或 或 我希望能够指定 Toolbar 接受的唯一子级是 Toolb
我有这个简单的 React 组件: import {PropTypes} from 'react'; import Column from './Column'; export default fun
我应该向父组件及其子组件添加 propTypes 吗? 例如我有一个 传递 3 个 Prop 的组件,我这样验证: const Header = function(props) { if (pro
我是一名优秀的程序员,十分优秀!