【问题标题】:TypeError: Cannot read property 'props' of undefined reactTypeError:无法读取未定义反应的属性“道具”
【发布时间】:2020-06-05 14:36:22
【问题描述】:

我是反应 js 的新手,并且遵循反应代码给了我这个错误
“TypeError:无法读取 Button 处未定义的属性 'props' (D:\my-app.next\server\static\PqudrDXAzXfiQCJ2zK-7F\pages\index.js:408:59)。”

请帮我解决这个问题,谢谢。

这是我的 index.js

import React, { Component } from 'react';
import Link from 'next/link';
import Head from '../components/head';
import Nav from '../components/nav';
import Button from '../components/Button';
export default () => (
<div>
<Head title="Home" />
<Nav />
<Button text="Demo Button" />
</div>
);

这是我的 Button.js 文件

import React from 'react';
import './button.css';
import { string } from 'prop-types';

const Button = (props) => (
<button>{ props.text } </button>
);
Button.propTypes = {
text: string
 };

export default Button;

【问题讨论】:

  • 你应该把 JSX 还给你。即return ( &lt;button&gt;.... ),return (&lt;div&gt;&lt;Head...
  • 嗨@tikkes,感谢您的回复。你能告诉我在这种情况下应该如何使用 return 语句。
  • 如果省略大括号,则不需要像箭头函数那样返回以下语句。

标签: reactjs components react-props


【解决方案1】:

请检查这个工作示例:

import React from "react";
import { string } from "prop-types";
const Button = props => <button> {props.text} </button>;
Button.propTypes = {
  text: string
};
export default () => (
  <div>
    <Button text="Demo Button" />
  </div>
);

【讨论】:

  • 感谢 @radulle 为我工作,这太容易了。
猜你喜欢
  • 2019-05-09
  • 1970-01-01
  • 2022-09-27
  • 2020-09-07
  • 2021-06-22
  • 2021-07-10
  • 2017-01-01
  • 2021-01-16
  • 2021-08-05
相关资源
最近更新 更多