IView组件中，Table指定行列样式--学习笔记

在使用IView这套漂亮的UI组件时，会遇到需要指定某行或者某列或者某单元格的样式的方法：[官方文档]https://www.iviewui.com/components/table
几个注意点：

1. 在Table组件调用时prop指定 :rowClassName="rowClassName"
   是一个函数名，在methods方法中要去实现这个回调函数

rowClassName(row,index){
                if(index===1){
                    return 'demo-table-info-row';
                }
                return '';
            }

2. 这个回调函数返回一个class样式名：demo-row-red，在调用这个Table组件的父组件中的样式要如下：

    .ivu-table .demo-table-info-row td{
        background-color: pink;
    }

千万注意前面加上.ivu-table 以及后面加上td。为啥？我也不知道（我不太懂CSS，猜想这个加上是为了最后CSS整合的时候能定位到.....希望有大神能懂得给个科学的解释......）

3. 引申：比如说，我做了个vue组件叫myTable.vue，简单的说这个myTable.vue组件是封装并扩展了IView的Table组件。那么，我的业务系统要调用我自己的这个myTable组件的时候，才想起来要去指定特定行样式，怎么办？
   去修改myTable.vue？在myTable.vue增加样式函数？肯定不行，因为我这个业务模块要这样定义行样式，要是要换个业务模块也调用这个mytable.vue,要用不同的行样式怎么办？
   所以，当前的做法是：把myTable组件的props中把rowClassName抛出来，去给调用组件去实现啦。注意的是：这个是函数，需要指定下类型。

//myTable.vue的script段中：
        props:{
            rowClassName:{
                type:Function,
                default(){
                    return ''
                }
            },

//myTable.vue的 template段中：
<Table :row-class-name="rowClassName" 
      :columns="bizColumns" :data="bizData"></Table> 

在业务模块调用时

//业务模块中：
<myTable :columns="tableCols" :data="tableData" 
      :rowClassName="mydefineRow"></myTable>

//然后在业务模块去实现这个回调函数：
methods:{
     mydefineRow(row,index){
                if(index===1){
                    return 'demo-row-red';
                }
                return '';
            }
}
//省略掉的内容：在业务模块中去实现.demo-row-red这个css，再强调下别忘了前面的.ivu-table  以及后面加上td