javascript - React.js 和 ExtJS 4

标签 javascript extjs reactjs

我刚刚探索了react.js,我认为它很棒,但我有一个问题。 您知道如何使用 React.js 渲染 extjs 布局吗?

我知道react.js旨在创建组件,而不是整个布局。所以我认为我需要使它们相对(组件之间的链接操作,例如按钮,使用其他输入组件中的文本更改某些 div 的值?)

感谢您的任何想法。

最佳答案

将更改传播到第一个共同祖先,该祖先将值保持在其状态中,并且使用该值的组件通过其props发送该值

ColorChangeButton = React.createClass({
    render: function() {
        return <button 
                  onClick={this.props.onChangeColor}
                  className={this.props.color} />

    }
});

ColoredDiv = React.createClass({
    render: function() {
        return <div className={this.props.color} />
    }
});

Container = React.createClass({
    getInitialState: function() {
        return { color:"blue" }
    },
    onChangeColor: function() {
        this.setState({color:"red"})
    },
    render: function() {
        return (
          <section>
            <ColorChangeButton 
                color={this.state.color} 
                onChangeColor={this.onChangeColor} />
            <ColoredDiv color={this.state.color} />
          </section>
        )
    }
})

关于javascript - React.js 和 ExtJS 4,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19357570/

相关文章:

javascript - 在 Intern 3.x 中测试 Dojo 1.x 应用程序

javascript - 使用 ng-repeat 在数组之间切换

javascript - 输入类型文本即使在可编辑后也不接受值

javascript - 网格显示没有数据,但有请求直接为什么

javascript - Extjs GridFilter 功能不起作用

javascript - 已发布的 React 应用程序中函数的可变性

javascript - 消除加载 javascript/css 时的页面闪烁

extjs - 在 Firebug 中调试 Extjs 4

reactjs - 如何使用 React Hooks 将带有构造函数的类转换为功能组件?

javascript - 在 firebase 中存储空数组