关于Element UI Table 的 slot-scope

在element的table组件中经常使用slot-scope（作用域插槽）来实现数据传递的需求，究竟什么是slot-scope？

个人认为可以把它看作是传递数据的对象。

实际上vue原生slot-scope 的值将被用作一个临时变量名，可以接收父组件传过来的值，而在element中的table对slot-scope的值封装成了一个大的对象,对象里面有属性row(行)，column(列)，$index(索引)，store,所以我们可以通过scope.row拿到对应的值。

作者：一个儿子叫Python的前端
链接：https://www.jianshu.com/p/a9d98bd37b78
来源：简书
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

<el-table :data="addPlanRoute" border style="width:100%" @cell-dblclick="tableDbEdit">
   <el-table-column property="order1" label="顺序"></el-table-column>
   <el-table-column property="order2" label="装车点">
       <template slot-scope="scope">
           <el-input v-model="scope.row.order2" placeholder="请输入内容"></el-input>
       </template>
   </el-table-column>
</el-table>

具体 scope 的数值也可以打印出来看看

<el-table :data="addPlanRoute" border style="width:100%" @cell-dblclick="tableDbEdit">
       <el-table-column property="order1" label="顺序"></el-table-column>
       <el-table-column property="order2" label="装车点">
           <template slot-scope="scope">
               <el-button size="mini" type="primary" @click="add(scope1)">添加</el-button>
           </template>
       </el-table-column>
</el-table>
<script>
methods:{
    add(scope1){
      console.log(scope1)
    },
}
</script>