原文地址：
原文作者：
译者：
特别声明：本文是作者 发布在 上的一个系列。
版权归作者所有。
译者在翻译前已经和作者沟通得到了翻译整个系列的授权。
为了不影响大家阅读，获得授权的记录会放在本文的最后。
很开心见到大家这么喜欢 VueDose 的教程，最近我收到了让我惊讶的关于性能提升的反馈，我非常感激读者们的支持和赞扬 ?。
正文
上周 Vue.js 的 2.6.0-beta.3 版本已经发布，其中包含了进一步简化作用域插槽的新特性。
这篇文章介绍了 vue 的新指令 v-slot 和其简写方式，就如在 和 中描述的一样。
为了能够弄清楚它是怎样简化语法的，我们来一起看看它在当前作用域插槽是怎样的。想象一下你有一个 List 组件，并且它暴露了一个过滤后的列表数据作为它的作用域插槽。
你使用该带有作用域插槽的 List 组件应该如下所示：
复制代码
{
{ item }}
我们所要讲解的主要内容与 List 组件的实现方式并没有太大的关系，但是你可以在这个 查看示例源码。
然而，我们可以直接在组件标签上使用新指令 v-slot，避免了额外的嵌套：
复制代码
{
{ item }}
记住 v-slot 指令只能用在组件或 template 标签上，而不能使用在原生 html 标签上。
这种方式能让代码可读性更高，特别是在你有嵌套的作用域插槽，使得难以定位作用域来源的情况下。
v-slot 指令也提供了一个绑定 slot 和 scope-slot 指令的方式，但是需要使用一个 : 来分割它们。举个摘自 的例子：
复制代码 Loading...
- { { user.name }}
Error: {
{ error.message }}
以上例子可以使用 v-slot 指令重写如下：
复制代码 Loading...
- { { user.name }}
Error: {
{ error.message }}
最后，v-slot 以符号 # 作为其指令的简写模式，上一个例子可以被重写为：
复制代码 Loading...
- { { user.name }}
Error: {
{ error.message }}
要记住的是，v-slot 指令默认应该简写为 #default。
读完文章，对于这个新的 slot 语法你感到兴奋吗？
你可以在线阅读这篇 ，里面有可供复制粘贴的源代码。如果你喜欢这个系列的话，请分享给你的同事们！
结语
此系列的其他文章，会同步系列官网的发布情况，及时地翻译发布到掘金。请持续关注，相信我会给大家带来更多优质的内容，不要忘了点赞~
如果想要了解译者的更多，请查阅如下：
- 个人博客：
- 个人 github 仓库：
- 个人微信公众号：搜索「程序猿何大叔」
请求翻译授权记录
觉得本文不错的话，分享一下给小伙伴吧~
