ES6包装组件内的组件

Question

const Dropdown = createReactClass({

  render() {
    return 'something'
  }
});

module.exports = enhanceWithClickOutside(Dropdown);

如何在ES6中使用上面的代码做出反应？

class Dropdown extends React.Component {
    render() {
      return 'something'
    }
}

//where to put the enhanceWithClickOutside?

我正在尝试使用此程序包https://www.npmjs.com/package/react-click-outside

这是我的尝试https://codesandbox.io/s/kx48qx7n63

Answer 1

您需要导出下拉类。这样的事情：export default enhanceWithClickOutside(Dropdown);

已编辑的沙箱：https://codesandbox.io/s/lp6jo7yjm

此外，请参阅此处的另一个示例：https://github.com/davidhu2000/react-spinners/blob/master/examples/components/color_picker.jsx

Answer 2

import React from 'react';

const Dropdown = () => ('something');

export default Dropdown;

或者，如果你想在返回之前做一些计算

import React from 'react';

const Dropdown = props => {
    // do your computations
    return 'something';
};

export default Dropdown;