@rlyle1179/react-treeview
Version:
A modern, themable and configurable treeview for React.
42 lines (34 loc) • 1.14 kB
JSX
import React from 'react';
import TreeView from '../../../../src/deni-react-treeview/deni-react-treeview';
import FaTrashO from 'react-icons/lib/fa/trash-o';
import FaEdit from 'react-icons/lib/fa/edit';
import './OnRenderItem.scss';
class Example extends React.Component {
onRenderItem(item, treeview) {
return (
<div className="treeview-item-example">
<span className="treeview-item-example-text">{item.text}</span>
<span className="actionButton trash" onClick={this.deleteItemClick.bind(this, item.id)}><FaTrashO size="15" /></span>
<span className="actionButton edit" onClick={this.editItemClick.bind(this)}><FaEdit size="15" /></span>
</div>
)
}
deleteItemClick(id) {
this.refs.treeview.api.removeItem(id);
}
editItemClick(id) {
alert('editing routine here...')
}
render() {
return (
<TreeView
className="onrenderitem-example"
ref="treeview"
url="https://denifakedata.herokuapp.com/tree/countries"
selectRow={ true }
onRenderItem={ this.onRenderItem.bind(this) }
/>
)
}
}
export default Example;