diff --git a/README.md b/README.md
index 9067b174e..bfb9fe9af 100644
--- a/README.md
+++ b/README.md
@@ -182,6 +182,24 @@ React.render(
, mountNode);
|
handle rowClick action, index means the index of current row among fatherElement[childrenColumnName] |
+
+ | onRowMouseOver |
+ Function(record, index) |
+ |
+ handle rowMouseOver action, index means the index of current row among fatherElement[childrenColumnName] |
+
+
+ | onRowMouseOut |
+ Function(record, index) |
+ |
+ handle rowMouseOut action, index means the index of current row among fatherElement[childrenColumnName] |
+
+
+ | onRowMouseUp |
+ Function(record, index) |
+ |
+ handle rowMouseUp action, index means the index of current row among fatherElement[childrenColumnName] |
+
| onRowDoubleClick |
Function(record, index) |
diff --git a/src/Table.jsx b/src/Table.jsx
index ff33276b0..2c82cf150 100644
--- a/src/Table.jsx
+++ b/src/Table.jsx
@@ -27,6 +27,9 @@ const Table = React.createClass({
onExpandedRowsChange: PropTypes.func,
indentSize: PropTypes.number,
onRowClick: PropTypes.func,
+ onRowMouseOver: PropTypes.func,
+ onRowMouseOut: PropTypes.func,
+ onRowMouseUp: PropTypes.func,
onRowDoubleClick: PropTypes.func,
expandIconColumnIndex: PropTypes.number,
showHeader: PropTypes.bool,
@@ -52,6 +55,9 @@ const Table = React.createClass({
onExpand() {},
onExpandedRowsChange() {},
onRowClick() {},
+ onRowMouseOver() {},
+ onRowMouseOut() {},
+ onRowMouseUp() {},
onRowDoubleClick() {},
prefixCls: 'rc-table',
bodyStyle: {},
@@ -297,7 +303,11 @@ const Table = React.createClass({
const rowRef = props.rowRef;
const expandedRowClassName = props.expandedRowClassName;
const needIndentSpaced = props.data.some(record => record[childrenColumnName]);
+
const onRowClick = props.onRowClick;
+ const onRowMouseOver = props.onRowMouseOver;
+ const onRowMouseOut = props.onRowMouseOut;
+ const onRowMouseUp = props.onRowMouseUp;
const onRowDoubleClick = props.onRowDoubleClick;
const expandIconAsCell = fixed !== 'right' ? props.expandIconAsCell : false;
@@ -352,6 +362,9 @@ const Table = React.createClass({
columns={leafColumns}
expandIconColumnIndex={expandIconColumnIndex}
onRowClick={onRowClick}
+ onRowMouseOver={onRowMouseOver}
+ onRowMouseOut={onRowMouseOut}
+ onRowMouseUp={onRowMouseUp}
onRowDoubleClick={onRowDoubleClick}
height={height}
{...onHoverProps}
diff --git a/src/TableRow.jsx b/src/TableRow.jsx
index 781d08b49..99576da85 100644
--- a/src/TableRow.jsx
+++ b/src/TableRow.jsx
@@ -6,6 +6,9 @@ const TableRow = React.createClass({
propTypes: {
onDestroy: PropTypes.func,
onRowClick: PropTypes.func,
+ onRowMouseOver: PropTypes.func,
+ onRowMouseOut: PropTypes.func,
+ onRowMouseUp: PropTypes.func,
onRowDoubleClick: PropTypes.func,
record: PropTypes.object,
prefixCls: PropTypes.string,
@@ -34,6 +37,9 @@ const TableRow = React.createClass({
getDefaultProps() {
return {
onRowClick() {},
+ onRowMouseOver() {},
+ onRowMouseOut() {},
+ onRowMouseUp() {},
onRowDoubleClick() {},
onDestroy() {},
expandIconColumnIndex: 0,
@@ -83,6 +89,21 @@ const TableRow = React.createClass({
onRowClick(record, index, event);
},
+ onRowMouseOver(event) {
+ const { record, index, onRowMouseOver } = this.props;
+ onRowMouseOver(record, index, event);
+ },
+
+ onRowMouseOut(event) {
+ const { record, index, onRowMouseOut } = this.props;
+ onRowMouseOut(record, index, event);
+ },
+
+ onRowMouseUp(event) {
+ const { record, index, onRowMouseUp } = this.props;
+ onRowMouseUp(record, index, event);
+ },
+
onRowDoubleClick(event) {
const { record, index, onRowDoubleClick } = this.props;
onRowDoubleClick(record, index, event);
@@ -158,6 +179,9 @@ const TableRow = React.createClass({
return (
{
+ const div = document.createElement('div');
+ document.body.appendChild(div);
+ let node;
+
+ const columns = [{
+ title: 'Name',
+ dataIndex: 'name',
+ key: 'name',
+ width: 400,
+ }, {
+ title: 'Age',
+ dataIndex: 'age',
+ key: 'age',
+ width: 100,
+ render: (text) => (
+
+ Alert: {text}, click will pop to row click
+
+ ),
+ }, {
+ title: 'Address',
+ dataIndex: 'address',
+ key: 'address',
+ width: 200,
+ }];
+ const data = [{
+ key: 1,
+ name: 'a',
+ age: 32,
+ address: 'I am a',
+ }];
+
+ const spy = {
+ callCount: 0,
+ callArgs: null,
+ };
+
+ const onRowMouseOver = (...args) => {
+ spy.callArgs = args;
+ spy.callCount += 1;
+ };
+
+ const onRowMouseOut = (...args) => {
+ spy.callArgs = args;
+ spy.callCount += 1;
+ };
+
+ const onRowMouseUp = (...args) => {
+ spy.callArgs = args;
+ spy.callCount += 1;
+ };
+
+ beforeEach(() => {
+ ReactDOM.render(
+ ,
+ div
+ );
+ node = $(div);
+ });
+
+ afterEach(() => {
+ ReactDOM.unmountComponentAtNode(div);
+ spy.callArgs = null;
+ spy.callCount = 0;
+ });
+
+ it('mouseOver', () => {
+ Simulate.mouseOver(node.find('tbody tr:first')[0]);
+ expect(spy.callCount).to.be(1);
+ expect(spy.callArgs[0]).to.be(data[0]);
+ expect(spy.callArgs[1]).to.be(0);
+ expect(spy.callArgs[2].type).to.be('mouseover');
+ });
+
+ it('mouseUp', () => {
+ Simulate.mouseUp(node.find('tbody tr:first')[0]);
+ expect(spy.callCount).to.be(1);
+ expect(spy.callArgs[0]).to.be(data[0]);
+ expect(spy.callArgs[1]).to.be(0);
+ expect(spy.callArgs[2].type).to.be('mouseup');
+ });
+
+ it('mouseOut', () => {
+ Simulate.mouseOut(node.find('tbody tr:first')[0]);
+ expect(spy.callCount).to.be(1);
+ expect(spy.callArgs[0]).to.be(data[0]);
+ expect(spy.callArgs[1]).to.be(0);
+ expect(spy.callArgs[2].type).to.be('mouseout');
+ });
+});