react-toolbox/components/list/index.jsx

52 lines
1.2 KiB
JavaScript

import React from 'react';
import PureRenderMixin from 'react-addons-pure-render-mixin';
import style from './style';
export default React.createClass({
mixins: [PureRenderMixin],
displayName: 'List',
propTypes: {
className: React.PropTypes.string,
dataSource: React.PropTypes.array,
template: React.PropTypes.func,
onClick: React.PropTypes.func,
type: React.PropTypes.string
},
getDefaultProps () {
return {
attributes: '',
className: '',
dataSource: [],
type: 'default'
};
},
onClick (event, data, index) {
if (this.props.onClick) {
this.props.onClick(event, data, (this.refs[index] ? this.refs[index] : null));
}
},
render () {
let className = `${style.root} ${this.props.className}`;
if (this.props.type) className += ` ${this.props.type}`;
const items = this.props.dataSource.map((data, index) => {
return (
<li key={index} onClick={this.onClick.bind(null, data, index)}>
{this.props.template(data, index)}
</li>
);
});
return (
<ul data-react-toolbox='list' className={className}>
{ items }
</ul>
);
}
});