如何在React中改变另一个对象的状态

大家好。你能告诉我如何从另一个对象上访问对象单击动作的某些对象的更改状态吗?

我有元素计算器，它有一组按钮和一个指示器。我想在某个按钮被点击时改变指示器的状态。例如，如果单击任何按钮，则增加指示值;

<style>
#calculator table {
    padding: 5px;;
    border: ridge 3px;
}
#calculator table tr td {
    text-align: center;
}
.nav-button, .nav-button button {
    width: 100%;
}
.calc-indicator {
    margin-bottom: 10px;
    margin-top: 5px;
    width: 100%;
}
.calc-indicator input {
    border: solid 1px;
    border-radius: 5px;
    width: 93%;
    padding: 4px;
    text-align: right;
}
</style>

var Indicator = React.createClass({
    getInitialState: function () {
        return {
            value: 0
        }
    },
    render: function () {
        return (
                <div className="calc-indicator">
                    <input type="text" value={this.state.value}/>
                </div>);
    }
});
var Button = React.createClass({
    buttonClicked: function () {
        // here I wanna update Indicators state and render Indicator
    },
    render: function () {
        return (
                <div className="nav-button" id={this.props.digit}
                     onClick={this.buttonClicked.bind(this, "nav-button")}>
                    <button>{this.props.digit}</button>
                </div>
        );
    }
});

var Calculator = React.createClass({
    render: function () {
        return (
                <div id="calculator">
                    <table>
                        <tr>
                            <td colSpan="4">
                                <Indicator />
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <Button digit="MC"/>
                            </td>
                            <td>
                                <Button digit="MR"/>
                            </td>
                            <td>
                                <Button digit="M+"/>
                            </td>
                            <td>
                                <Button digit="M"/>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <Button digit="BS"/>
                            </td>
                            <td>
                                <Button digit="CL"/>
                            </td>
                            <td>
                                <Button digit="C"/>
                            </td>
                            <td>
                                <Button digit="/"/>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <Button digit="7"/>
                            </td>
                            <td>
                                <Button digit="8"/>
                            </td>
                            <td>
                                <Button digit="9"/>
                            </td>
                            <td>
                                <Button digit="*"/>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <Button digit="4"/>
                            </td>
                            <td>
                                <Button digit="5"/>
                            </td>
                            <td>
                                <Button digit="6"/>
                            </td>
                            <td>
                                <Button digit="-"/>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <Button digit="1"/>
                            </td>
                            <td>
                                <Button digit="2"/>
                            </td>
                            <td>
                                <Button digit="3"/>
                            </td>
                            <td>
                                <Button digit="+"/>
                            </td>
                        </tr>
                        <tr>
                            <td colSpan="2">
                                <Button digit="0"/>
                            </td>
                            <td>
                                <Button digit="."/>
                            </td>
                            <td>
                                <Button digit="="/>
                            </td>
                        </tr>
                    </table>
                </div>
        );
    }
});
React.render(<Calculator />, document.body);

如果你知道如何使代码更好，请发布你的变体。感谢您的宝贵时间。