===============================
===============================
默认插槽
只有一个slot
具名插槽
当有多个slot时,每个slot有名字的插槽(name)
只有template才能用v-slot 【这个是新设计的技术 Vue2.6以后用的】
作用域插槽
反向传数据
App.vue中,必须用 template
数据从Category.vue 反向传给了App.vue的atguigu
一般是从 App.vue 给 Category.vue 传值。
===============================
Vue slot-scope="scope"
status状态值为0就是代办,为1就是处置,为2就是完成
此外这里每行还有编辑,删除等功能,事件处理函数中的参数,scope.$index就是该行的下标,scope.row就是该行的数据所有消息对象,有了这两个参数我们就可以实现编辑(分配,转派,完工),删除功能,所以这个 slot-scope="scope"是非常重要的
slot-scope="scope"
本质上就是一个插槽,scope
的row
属性有着表格一整行的数据。
它还有其他有用的属性,比如$index
作用域插槽实际上是带有数据的插槽,可以获取到父组件传递的参数,将这些参数使用到子组件插槽里
scope相当于一行的数据, scope.row相当于当前行的数据对象。
这里就是用插槽 拿到当前行 row是个内置的属性 ,vue slot的scope传递值是父作用域中的源数据改变,值会同步改变。且{{scope.$index}}可以获取当前行的index。
现在vue提供了scope 以及 scope.row 可以让我们更方便的操作数据
slot-scope='scope'
作用域插槽中定义一个对象(这里对象被定义为scope)来存储插槽上绑定的数据的用法scope.row
使用ElementUI表格模板渲染数据时使用
当前行数据的获取也会用到插槽,scope相当于一行的数据, scope.row相当于当前行的数据对象
REF
https://www.cnblogs.com/sunny3158/p/17306490.html