JavaScript
语言：
JaveScriptBabelCoffeeScript
确定
var data = [
{name: 'Red', value: 'red'},
{name: 'Blue', value: 'blue'},
{name: 'Yellow', value: 'yellow'},
{name: 'Green', value: 'green'},
{name: 'White', value: 'White'}
];
var TabSelector = React.createClass({
getInitialState: function() {
return {selected: this.props.selected};
},
handleOnClick: function (evt) {
this.setState({'selected': evt.target.getAttribute('data-value')})
},
render: function() {
var tabs = this.props.data.map(function (item) {
var selected = item.value == this.state.selected ? 'selected' : '';
return
className={selected}
onClick={this.handleOnClick}
>{item.name}
;
}, this);
return
{this.props.label}
{tabs}
;
}
});
React.render(
TabSelector({label: 'Color', data: data, selected: null}),
document.getElementById('container')
);
