del align, optimize the demo of colspan-rowspan

README.md

@@ -200,7 +200,7 @@ var table = React.render(
                       <td>render</td>
                       <td>Function(value, row, index)</td>
                       <th></th>
-                      <td>The render function of cell, has three params: the text of this cell, the record of this row, the index of this row, it's return an object:{children: value, props:{align:'center', colSpan: 1, rowSpan:1}}==>'children' is the text of this cell, props is some setting of this cell, eg: 'align' set text-align, 'colspan' set td colspan, 'rowspan' set td rowspan</td>
+                      <td>The render function of cell, has three params: the text of this cell, the record of this row, the index of this row, it's return an object:{children: value, props:{colSpan: 1, rowSpan:1}}==>'children' is the text of this cell, props is some setting of this cell, eg: 'colspan' set td colspan, 'rowspan' set td rowspan</td>
                   </tr>
                 </tbody>
             </table>

examples/colspan-rowspan.js

@@ -12,9 +12,7 @@ var columns = [
   {title: '手机号', dataIndex: 'a', colSpan: 2, width: 100, key: 'a', render: function(o, row, index){
     let obj = {
       children: o,
-      props:{
-        align:'left'
-      }
+      props: {}
     };
     //设置第一行为链接
     if(index === 0){
@@ -23,7 +21,6 @@ var columns = [
     //第5行合并两列
     if(index === 4){
       obj.props.colSpan = 2;
-      obj.props.align = 'center';
     }
 
     if(index === 5){
@@ -34,9 +31,7 @@ var columns = [
   {title: '电话', dataIndex: 'b', colSpan: 0, width: 100,key: 'b', render: function(o, row, index){
     let obj = {
       children: o,
-      props:{
-        align:'left'
-      }
+      props: {}
     };
     //列合并掉的表格设置colSpan=0，不会去渲染
     if(index === 4 || index === 5){
@@ -47,9 +42,7 @@ var columns = [
   {title: '姓名', dataIndex: 'c', width: 100, key: 'c', render: function(o, row, index){
     let obj = {
       children: o,
-      props:{
-        align:'left'
-      }
+      props: {}
     };
 
     if(index === 5){
@@ -60,9 +53,7 @@ var columns = [
   {title: '住址', dataIndex: 'd', width: 200, key: 'd', render: function(o, row, index){
     let obj = {
       children: o,
-      props:{
-        align:'left'
-      }
+      props: {}
     };
     if(index === 0){
       obj.props.rowSpan = 2;
@@ -75,15 +66,14 @@ var columns = [
 
   }},
   {title: '性别', dataIndex: 'e',  width: 200, key: 'e', render: function(o, row, index){
+    let obj = {
+      children: o,
+      props: {}
+    };
     if(index === 5){
-      return {
-        children: o,
-        props:{
-         align:'left',
-          colSpan:0
-        }
-      }
+      obj.props.colSpan = 0;
     }
+    return obj;
   }},
   {
     title: '操作', dataIndex: '',key: 'f',

src/TableRow.jsx

@@ -33,7 +33,6 @@ const TableRow = React.createClass({
       let colSpan;
       let rowSpan;
       let notRender = false;
-      let align = 'left';
 
       if (i === 0 && expandable) {
         expandIcon = (<span
@@ -56,14 +55,13 @@ const TableRow = React.createClass({
         }
         rowSpan = tdProps.rowSpan;
         colSpan = tdProps.colSpan;
-        align = tdProps.align || 'left';
       }
 
       if (rowSpan === 0 || colSpan === 0) {
         notRender = true;
       }
       if (!notRender) {
-        cells.push(<td key={col.key} style={{textAlign: align}} colSpan={colSpan} rowSpan={rowSpan} className={`${colClassName}`}>
+        cells.push(<td key={col.key} colSpan={colSpan} rowSpan={rowSpan} className={`${colClassName}`}>
         {expandIcon}
         {text}
         </td>);