vue中的scope使用详解(2)

最后在模板上使用scope来接收slot中的属性;因此scope的值是如下一个对象:

{"row":{"name":"kongzhi1","age":"29","sex":"man"},"$index":0}

因为遍历了二次,因此还有一个是如下对象;

{"row":{"name":"kongzhi2","age":"30","sex":"woman"},"$index":1}

从上面返回的scope属性值我们可以看到,scope返回的值是slot标签上返回的所有属性值,并且是一个对象的形式保存起来,该slot有两个属性,一个是row,另一个是$index, 因此返回 {"row": item, "$index": "index索引"}; 其中item就是data里面的一个个对象。

最后页面被渲染成如下页面;

查看页面效果;

总结

以上所述是小编给大家介绍的vue中的scope使用详解,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言!