CODEWITHSUNDEEP
javascriptreactjsimportreact-routerexport
Tameiki
Tameiki

Reputation: 45

React router: How to import functions

I want to export the function, welcome(), from my App file to another file, AddKit, which is one of the file defining a page of my application. I tried various means but each time I have this error:

TypeError: Cannot read property 'welcome' of undefined

App.js :

class App extends Component {
  welcome(){
    return 'TrialOne';
  }

  render() {
    if (!this.state.web3) {
      return <div>Loading Web3, accounts, and contract...</div>;
    }
    return (
       <BrowserRouter>
        <nav>
          <Navigation/>
            <Switch>
             <Route path="/" component={Home} exact/>
             <Route path="/addKit" component={AddKit} exact/>
           </Switch>
        </nav> 
      </BrowserRouter>
    );
  }
}

export default App;

AddKit.js:

import React from 'react';
import welcome from '../App.js'

const AddKit = () => {
    return (
       <div>
          <h1>AddKit</h1>
          <p>AddKit page body content</p>
       </div>
    );
}
 
export default AddKit;

So, how do I properly export and use this function inside my AddKit file?

Upvotes: 0

Views: 713

Answers (1)

Saba
Saba

Reputation: 373

You need to define welcome function as below:

export const Welcome = () => {return ()}

and then import it this way:

import { Welcome } from '../App.js'

Upvotes: 1

Related Questions