首页 > 解决方案 > 在 React 中 linting 时无法读取未定义的属性“类型”

问题描述

我有三个组件应用程序,访客,用户。我正在检查条件(App.js),如果它是真的,那么用户组件将呈现,否则客户组件。我收到错误。错误是无法读取未定义的属性“类型” linting 时发生如何解决此问题。

*Index.html*
<title>React App</title>
  </head>
  <body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>


**Index.js**

import React from 'react'
import ReactDOM from 'react-dom'
import App from './App'
ReactDOM.render(<App consumer= {true} />,document.getElementById('root'));


**App.js**

import React, {Component} from 'react'
import User from './User.js'
import Guest from './Guest.js'

export default class App extends Component{
    render(){
        const varify = this.props.consumer;
        if (varify) {
          return <User />;
        }
    return <Guest />;
     }
}

 **User.js**

import React, {Component} from 'react'

export default class User extends Component{
    render(){
    return(
        <div>
        <h1> Welcome </h1>
        <button>Log out</button>
        </div>
    );
}
}

**Guest.js**

mport React, {Component} from'react'

export default class Guest extends  Component {
    render (){
        return (
            <div>
            <h1>Welcome Guest</h1>
            <button>Login</button>
         <button>Sign Up</button>
            </div>
        );
    
}
}

标签: javascriptreactjs

解决方案


推荐阅读