TypeError:无法读取未定义的属性“代码”?

时间:2020-09-16 09:02:28

标签: javascript reactjs import react-component

Dashboard.js

import React from 'react';

const Dashboard = () => {
    return (
        <!--  Card Section  -->
        <div className="row">
            <div className="col s12 m6 l3">
                <div className="card blue-grey darken-1">
                    <div className="card-content white-text">
                        <span className="card-title center">20</span>
                        <p className="center">Task of Today</p>
                    </div>
                </div>
            </div>

            <div className="col s12 m6 l3">
                <div className="card blue-grey darken-1">
                    <div className="card-content white-text">
                        <span className="card-title center">20</span>
                        <p className="center">Bugs</p>
                    </div>
                </div>
            </div>

            <div className="col s12 m6 l3">
                <div className="card blue-grey darken-1">
                    <div className="card-content white-text">
                        <span className="card-title center">20</span>
                        <p className="center">Finished Task</p>
                    </div>
                </div>
            </div>

            <div className="col s12 m6 l3">
                <div className="card blue-grey darken-1">
                    <div className="card-content white-text">
                        <span className="card-title center">20</span>
                        <p className="center">Remaining Task</p>
                    </div>
                </div>
            </div>
        </div>
    )
}

export default Dashboard;

从app.js导入此错误后

./src/components/Dashboard/Dashboard.js
TypeError: Cannot read property 'code' of undefined
    at parser.next (<anonymous>)
    at normalizeFile.next (<anonymous>)
    at run.next (<anonymous>)
    at transform.next (<anonymous>)

我不知道发生了什么。没有可变代码。它来自哪里? 如果我不导入仪表板,应用程序运行正常。当我在app.js中导入Dashboard.js时发生错误。

1 个答案:

答案 0 :(得分:3)

尝试删除组件中的注释<!-- Card Section -->,它应该可以工作。

更正:

import React from 'react';

const Dashboard = () => {
    return (
        <div className="row">
            <div className="col s12 m6 l3">
                <div className="card blue-grey darken-1">
                    <div className="card-content white-text">
                        <span className="card-title center">20</span>
                        <p className="center">Task of Today</p>
                    </div>
                </div>
            </div>

            <div className="col s12 m6 l3">
                <div className="card blue-grey darken-1">
                    <div className="card-content white-text">
                        <span className="card-title center">20</span>
                        <p className="center">Bugs</p>
                    </div>
                </div>
            </div>

            <div className="col s12 m6 l3">
                <div className="card blue-grey darken-1">
                    <div className="card-content white-text">
                        <span className="card-title center">20</span>
                        <p className="center">Finished Task</p>
                    </div>
                </div>
            </div>

            <div className="col s12 m6 l3">
                <div className="card blue-grey darken-1">
                    <div className="card-content white-text">
                        <span className="card-title center">20</span>
                        <p className="center">Remaining Task</p>
                    </div>
                </div>
            </div>
        </div>
    )
}

export default Dashboard;