React:export const + export default vs export default

时间:2017-02-20 00:07:35

标签: reactjs webpack ecmascript-6

我通过“双重”导出遇到了当前的组件创建。你能解释一下它是否有真正的用途,或者只是作者的偏好?

import React from 'react'
import DuckImage from '../assets/Duck.jpg'
import './HomeView.scss'

export const HomeView = () => (
  <div>
    <h4>Welcome!</h4>
    <img
      alt='This is a duck, because Redux!'
      className='duck'
      src={DuckImage} />
  </div>
)

export default HomeView

P.S:当前代码后来被webpack2捆绑。

1 个答案:

答案 0 :(得分:17)

在这种情况下,两个导出导出相同的东西。 两者

import Homeview

import { Homeview } 

将为您提供相同的模块(HomeView组件)。

我看到你正在使用Redux。 如果你正在做类似

的事情
export const HomeView ...

export default connect(mapStateToProps)(HomeView);

这可能有用,因为您可能希望有时使用非Redux连接的组件,或者您可能需要它来进行测试。

相关问题