React アプリに Material-UI を使用しています。制御可能なコンポーネントを使用していTabsますTab。推奨される設定でthis.state.valueは、どのタブが開いているかを判断するために使用されます。inputタブ内のフィールド にテキストを入力するthis.state.valueと、SyntheticEvent. これは、入力ボックスが別のコンポーネントにある場合でも発生します。その結果、現在のタブが閉じられます。入力テキストが現在のタブを閉じないようにしたいと思います。提案してください?
var React = require('react');
var Tabs = require('material-ui/lib/tabs/tabs');
var Tab = require('material-ui/lib/tabs/tab');
module.exports = React.createClass({
getInitialState() {
return {
value: 'newGoal'
};
},
handleChange(value) {
this.setState({
value: value
});
},
render() {
console.log("this.state.value at TABS:", this.state.value);
return (
<Tabs
value={this.state.value}
onChange={this.handleChange}
>
<Tab label="New Goal" value="newGoal" >
<input></input>
</Tab>
<Tab label="Existing Goal" value="existingGoal">
</Tab>
</Tabs>
)
}
});