Question

像上面的问题一样：

无状态功能组件：

[INFO] koarb - Services .................................. SUCCESS [  7.093 s]
[INFO] gtz koarb 3.0 - webapp ............................ FAILURE [ 33.759 s]
[INFO] ------------------------------------------------------------------------
[INFO] BUILD FAILURE
[INFO] ------------------------------------------------------------------------
[INFO] Total time: 01:30 min
[INFO] Finished at: 2016-07-01T09:40:01+07:00
[INFO] Final Memory: 212M/868M
[INFO] ------------------------------------------------------------------------
[ERROR] Failed to execute goal org.apache.maven.plugins:maven-compiler-plugin:2.3:compile (default-compile) on project com.gtz.koarb.web: Compilation failure:
Compilation failure:
[ERROR] src\main\java\com\gtz\koarb\web\controllers\countryresolver\IPResolverServiceImpl.java:[41,3] error
: cannot find symbol
[ERROR]
[ERROR] src\main\java\com\gtz\koarb\web\controllers\countryresolver\IPResolverServiceImpl.java:[41,30] erro
r: cannot find symbol
[ERROR]
[ERROR] src\main\java\com\gtz\koarb\web\controllers\countryresolver\IPResolverServiceImpl.java:[41,81] erro
r: cannot find symbol
[ERROR]
[ERROR] src\main\java\com\gtz\koarb\web\controllers\countryresolver\IPResolverServiceImpl.java:[42,3] error
: cannot find symbol
[ERROR] -> [Help 1]
[ERROR]
[ERROR] To see the full stack trace of the errors, re-run Maven with the -e swit

只有渲染方法的组件：

const Comments = props => {
    return (
        <div></div>
    );
}

两种不同方式的本质是什么？他们是一样的，都是无国籍的吗？

Answer 1

基本上，这是短暂的细分：

如果出现以下情况，您必须使用ES6课程（class MyClass extends Component {}）或（React.createClass()）：
- 您需要访问lifecycle methods of your component （最常用的是componentWillMount，componentDidMount，componentWillUnmount和{{1基本上它意味着你依赖于库来为你的组件的每个实例调用一些函数，具体取决于你的应用程序中发生的事情。
- 您的组件直接访问您的商店，因此保持状态（通常也称为智能组件或容器）。有些人会争辩说，将商店与商店捆绑在一起并不一定意味着它是一个“聪明”的组件。也许它只适用于道具，并没有真正的内部状态。

如果您的组件只是接受道具并在页面上呈现它们，那么您正在处理无状态组件（通常也称为哑组件或表示组件）。由于组件本身没有任何作用，除了显示它应该显示的内容以及使用道具传递给它的所有内容之外，可以使用纯函数来表示它。这可以像你的例子一样简单：

componentWillReceiveProps

他们显然不必那么简单，也可能更复杂：抱孩子，只消耗部分道具，将其中的一部分传递给孩子，传递自己的道具等。

如果您想要真正纯粹的功能组件，建议您阅读 ES6 Features 并妥善处理这些内容。

以下是来自Dan Abramov的 great article （可能是关于该主题的最佳主题之一），希望能够消除任何困惑。

如果您的组件只执行渲染功能并显示某些内容（即无状态），则建议您使用功能组件。无处不在。它们重量更轻，承载的重量更轻。你可以找到，我相信，the best article on how to write optimal ES6 React components right here - 由Grgur Grisogono，现场的顶级人物之一。

无状态功能组件是否等于只具有render方法的Component？

无状态功能组件：

只有渲染方法的组件：

1 个答案: