当前位置: 首页 > 科技观察

VueConf21大会介绍:裕达提到脚本设置语法!

时间:2023-03-15 00:11:51 科技观察

如果你最近一直在使用Vite和Vue3,你会注意到Vue组件中使用了这种语法。import{ref,computed}from'vue'exportdefault{setup(){consta=ref(3)constb=computed(()=>a.value+2)constchangeA=()=>{a.value=4}return{a,b,changeA}//必须返回所有内容!}}如果使用不仅是数据,计算的属性和方法,甚至指令和组件都可以在我们的模板中自动获取。这很神奇。那么有什么意义呢?长话短说,这种语法使单个文件组件更简单。用RFC的原话来说,“该提案的主要目标是通过将通过这三种导入,我们就可以得到传统设置方式的常用功能。创建异步设置方法脚本设置语法的另一个很酷的特性是创建异步设置非常容易。这对于在创建组件时加载api很有用,甚至可以将代码绑定到函数。我们所要做的就是使我们的设置函数异步,在我们的脚本设置中使用顶级等待。例如,如果我们使用FetchAPI,我们可以使用await这样的设置()函数将是异步的。使用块来完成,如下所示。总结目前,这个脚本setut是可选的,所以如果您想尝试,只需在脚本标签中添加设置要了解有关脚本设置的更多信息,请单击此处,链接到完整的RFC及其动机、准确的语法和更多技术实现。作者:MattMaribojoc译者:前端小智来源:stackabuse原文:https://learvue.co/2021/05/explaining-the-ne-script-setup-type-in??-vue-3-major-takeaways-from-the-rfc/