时间戳

首页 > 解决方案 > React JS（元素类型无效）

javascript - React JS（元素类型无效）

问题描述

我正在尝试在 index.js 文件中呈现我的 App 函数。但它一直显示此错误：元素类型无效：预期字符串（用于内置组件）或类/函数（用于复合组件）但得到：对象。您可能忘记从定义组件的文件中导出组件，或者您可能混淆了默认导入和命名导入。检查App.

应用程序.js

import React from "react";
import { Container, AppBar, Typography, Grow, Grid} from '@material-ui/core';
import memories from './images/memories.png';
import Posts from './components/Posts/Posts';
import Form from './components/Form/Form.js';

const App = () => {
    return(
        <Container maxwidth="lg">
            <AppBar position="static" color="inherit">
                <Typography variant="h2" align="center">Memories</Typography>
                <img src={memories}  alt="memories" height="60"/>
            </AppBar>
            <Grow in>
                <Container>
                    <Grid container justify="space-between" alignItems="stretch" spacing={3}>
                        <Grid item xs={12} sm={7}>
                            <Posts/>
                        </Grid>
                        <Grid item xs={12} sm={4}>
                            <Form/>
                        </Grid>

                    </Grid>
                </Container>
            </Grow>
        </Container>
    )
}
export default App;

index.js

import React from 'react';
import ReactDOM from 'react-dom';

import App from './App';
ReactDOM.render(<App />, document.getElementById('root'));

标签： javascriptreactjscomponentsreact-componentreact-dom

解决方案

我已经使用export default function Form(){}而不是使用export default Form. 问题已解决，我不知道原因。感谢所有回答的人。

推荐阅读