Question

我不明白请帮助。我很反应。

这是我的代码。

import React, { Component } from 'react';
import './App.css';
import Signup from './Signup.js';
import Login from './Login.js';

class App extends Component {

  getInitialState(){
    return {signup:false,login:true}
  }

  switch(word){
    var signup,login;
    if(word == "signup"){signup = true;login = false;}
    else{login = true; signup = false;}
    return this.setState({login:login,signup:signup})    
  }

  render(){    //this is render method
    var self = this;
      return (
        <div>
          <div id="buttons">
            <p id="signupButton" onClick={self.switch.bind(null,"signup")} className={self.state.signup ? "yellow":"blue"}>Sign In</p>
            <p id="loginButton" onClick={self.switch.bind(null,"login")} className={self.state.login ? "yellow":"blue"}> Login</p>
          </div>              
            {self.state.signup? <Signup/> : null}
            {self.state.login? <Login /> : null}            
        </div>
            )
  }
}

export default App; // I think problem is here but not understood

/////////////////////////////////////////////// //////////////////////////////

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

class Login extends Component {
    render(){
            return (
                 <div>
                    <div id="login">
                        <input type="email" id="email" placeholder="Email"/>
                        <input type="password" id="password" placeholder="Password"/>
                        <button id="send">Send</button>
                    </div>
                  </div>
            )
      }
}

/////////////////////////////////////////////// /////////////////////////////

这是我的login.js页面代码 login.js

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

class Signup extends Component {

  render(){
         return (
            <div>
                  <div id="signup">
                        <input type="text" id="first" placeholder="First Name"/>
                        <input type="text" id="last" placeholder="Last Name"/>
                        <input type="email" id="email" placeholder="Email"/>
                    <input type="password" id="password" placeholder="Password"/>
                    <input type="password" id="confirm" placeholder="Confirm Password"/>
                    <button id="send">Send</button>
            </div>
                </div>

            )
      }
}

/////////////////////////////////////////////// //////////////////////////////

这是我的Signup.js页面代码 Signup.js

Get-CimInstance PrinterObject

/////////////////////////////////////////////// //////////////////////////////

我不理解的问题在哪里。

Answer 1

要使导入成为可能，您需要先导出您的课程：

export default class Signup extends Component {

在Signup.js和login.js中：

export default class Login extends Component {

Answer 2

您需要先导出课程。

例如Signup

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

class Signup extends Component {

  render(){
         return (
            <div>
                  <div id="signup">
                        <input type="text" id="first" placeholder="First Name"/>
                        <input type="text" id="last" placeholder="Last Name"/>
                        <input type="email" id="email" placeholder="Email"/>
                    <input type="password" id="password" placeholder="Password"/>
                    <input type="password" id="confirm" placeholder="Confirm Password"/>
                    <button id="send">Send</button>
            </div>
                </div>

            )
      }
}

export default Signup;

现在Signup类将导出为默认导出。

在App.js中，您可以通过import Signup from './Signup';

导入它

您应首先阅读有关ES6模块的更多信息。

http://2ality.com/2014/09/es6-modules-final.html

./src/App.js 83：48-54＆＃34;导出＆＃39;默认＆＃39; （导入为＆＃39;注册＆＃39;）未在＆＃39; ./ Signup.js＆＃39;中找到。

2 个答案: