javascript - react .js : prevent logic in jsx and move render out of component

Question

1. JSX 允许您内联 Javascript 逻辑/函数调用。有什么办法可以防止这种情况发生吗？这将迫使开发人员将逻辑移出 jsx，并将“计算”属性添加到 componentWillUpdate 中的 this.state。

2. 我还想将 render 完全移出 component，这样它只能访问 props 和 >state，并且无权访问this。从实现上来说，component会发布一个以{props: this.props, state: this.state}为数据的事件，事件总线执行相应的渲染。

有没有现有的方法可以满足这些要求？

Answer 1

我使用 React 模板 (http://wix.github.io/react-templates/)。我发现逻辑/表示的分离非常有用，因为与我团队中的图形设计师合作更容易(他们喜欢自己构建标记)。

尽管您仍然可以在模板中使用 javascript 逻辑，但这非常不方便，并且您被迫在组件中的辅助方法中进行思考，在我看来，这更干净，因为所有逻辑都在组件的代码中。

看看吧。