React Props 不起作用，完全是初学者答案

【问题标题】：React Props not working, complete beginnerReact Props 不起作用，完全是初学者
【发布时间】：2019-04-15 05:07:31
【问题描述】：

我正在仔细阅读教程，但我无法将 props 传递给函数组件并从 props 对象中提取数据。我认为这是进出口错误，但我真的很感激朝着正确的方向轻推。我正在使用 create-react-app

App.js

import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';

const Greeting = (props) => <h1>Hello {props.name}</h1>;

export default Greeting;

它只打印出 H1 标签中的 Hello，而忽略其余部分。

index.js

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';

const element = <Greeting name="irakli" />;

ReactDOM.render(element, document.getElementById('root'));
serviceWorker.unregister();

【问题讨论】：

您应该更改为 App，而不是 Greeting，因为您将其作为 App 导入。所以 const element =
将import App from './App';更改为import Greeting from './App';

标签： javascript reactjs react-props

【解决方案1】：

在我的 index.js 中：

用import Greeting from './App';代替import App from './App';

【讨论】：

我想我以前也尝试过，当然现在也尝试过。仍然没有显示。 :( 不过谢谢

【解决方案2】：

您应该更改为 App，而不是 Greeting，因为您将其作为 App 导入。所以

const element = <App name="John" />

【讨论】：

试过了，还是不行 :(感谢回复
它什么都不显示，而不是显示名称。这是屏幕：prntscr.com/lhdkpy
你能检查一下终端是否有任何错误或警告吗？

【解决方案3】：

在 App.js 中使用“导出默认应用”。

【讨论】：

这涵盖了现有答案未解决的问题？在用现有答案回答较旧的问题时，指出您的答案所针对的问题的新方面非常重要。答案还应包括对它们的工作方式和原因的解释。