Vue slot-scope=‘scope‘的理解

首先要理解2个知识点：
1.插槽
2.作用于插槽

插槽，也就是slot，是组件的一块HTML模板，这块模板显示不显示、以及怎样显示由父组件来决定。 实际上，一个slot最核心的两个概念这里就点出来了，是显示不显示和怎样显示

作用域插槽实际上是带有数据的插槽，可以获取到父组件传递的参数，将这些参数使用到子组件插槽里

<w-table-column prop="je" label="总价" width="100">
	 <template slot-scope="scope">
	   	<span>{{Number(scope.row.je).toFixed('2')}}</span>
	 </template>
</w-table-column>

其实这一段很多时候也会用到显示表格时,当前行数据的获取也会用到插槽

<el-table>
  <el-table-column width="150" align="center" label="Status">
    <template slot-scope="scope">
      <el-tag :type="scope.row.status | statusFilter">
      	{{scope.row.status}}
      </el-tag>
    </template>
  </el-table-column>
</el-table>

之前好像直接是scope，现在统一成了slot-scope，其语义更加的明确。scope相当于一行的数据， scope.row相当于当前行的数据对象。这里就是用插槽 拿到当前行 row是个内置的属性 ，vue slot的scope传递值是父作用域中的源数据改变，值会同步改变。且{{scope.$index}}可以获取当前行的index。

// index可以用来设置index, :row 可以设置行内内置对象
<slot :row="item" :$index="i"></slot>

也可以参考此篇讲解，个人感觉写得很详细很到位。
https://blog.csdn.net/houyibing930920/article/details/89513246