从 Flux 组件函数，如何访问输入的值？

Question

来自试图学习的 Flux 菜鸟的简单问题...

假设我想在我的 App 组件中定义一个执行此操作的简单函数：

on buttonA.click, send the value of textboxB

我该怎么做，我可以简单地引用 testSend 函数中渲染方法的输入吗？

我查看了 this example，但对于我的简单需求来说它似乎过于复杂。我真的必须为每个我想最终通过单击按钮发送值的文本框创建另一个组件吗？

这是我的组件：

export default class App extends Component {
    testSend: function( evt ) {
        // Here I want to send the textboxB.value
        //AppActions.add({ name: '...' });

    },

  render: function() {
    return (
        <input type="text" id="textboxB" />
        <button id="buttonA" onClick={ this.testSend }>Send Text</button>
    );
  },
}

Answer 1

我猜 Mathletics 的评论是为了指向解决方案 ;)

~~我只能使用简单的 javascript 语法，一次！ :D~~

~~testSend: function( evt ) { alert(document.getElementById('textboxB').value); //AppActions.add({ name: '...' }); }~~

解决方法是正确使用props和state，感谢大家的讨论和帮助！

var App = React.createClass({

    getInitialState: function () {
    return { username: this.props.username };
  },

    changeStateUsername: function( e) {
        //alert(e.target.value);
        this.setState({username: e.target.value});
    },

  render: function() {
    return (
        <input type="text" id="textboxB" value={this.state.username} onChange={this.changeStateUsername} />
        <button id="buttonA" onClick={ this.setNewUsername }>Set</button>
    );
  }
});

从 Flux 组件函数，如何访问输入的值？

From a Flux component function, how to access an input's value?

javascript

flux

node.js

reactjs