<template slot-scope="slotProps">
<!-- 打印itemvalue数据-->
<div style="background:red; border-bottom:2px solid blue;">
{{slotProps.itemvalue}}
</div>
<!-- 根据判断条件展示对号元素 -->
<span v-if="slotProps.itemValue.isComplete">✓</span>
<!-- 显示代办事项名称 -->
{{ slotProps.itemValue.test }}
</template>
</todo-list>
效果如下

附实例代码:github link
总结
其实作用域插槽很类似于入参函数,组件相当于cb,而cb的入参就相当与slotProps接收的参数,只不过名称和形式变了个样子。
<!-- 函数 -->
function foo(str,cb){
var msg = str + '你好';
cb(msg);
}
<!-- 调用 -->
foo('愚坤',function(msg){
alert(msg)
})foo('愚坤',function(msg){
console.log(msg)
})










