React使用export导出类

来源:互联网 发布:国外人工智能机器人 编辑:程序博客网 时间:2024/05/22 03:38

React中使用export导出类可以有两种方法

1. export default classname

这种导出方式与export default class classname extends React.class相同

在其他文件中引用时采取如下方式

import classname form path

例如:

Com.js

class Welcome extends React.Component{    render(){        return <h1> hello,{this.props.name}</h1>    }}function App(){    return (        <div>            <Welcome name="Sara"/>            <Welcome nmae="Peng"/>        </div>    );}export  default App;

index.js

import App  from './components/Com';const element=<App/>;ReactDOM.render(element, document.getElementById('root'));

2. export {classname1,classname2}

在其他文件中引用时采用如下方式

import {classname1,classname2} from path

import {classname1} //注意引用一个类时也要加上{}

例如:

class Welcome extends React.Component{    render(){        return <h1> hello,{this.props.name}</h1>    }}function App(){    return (        <div>            <Welcome name="Sara"/>            <Welcome nmae="Peng"/>        </div>    );}export  {Welcome,App};

index.js

import {App}  from './components/Com';const element=<App/>;ReactDOM.render(element, document.getElementById('root'));
阅读全文
0 0