vue中setup有什么作用
vue中setup有什么作用
本篇内容介绍了“vue中setup有什么作用”的有关知识，在实际案例的操作过程中，不少人都会遇到这样的困境，接下来就让小编带领大家学习一下如何处理这些情况吧！希望大家仔细阅读，能够学有所成！
在vue中，使用setup是为了封装复用；setup的设计是为了使用组合式api，当组件变得更大时，逻辑关注点的列表也会增长，会导致组件难以阅读和理解，而通过setup可以将该部分抽离成函数，就可以不用关心该部分的逻辑了。
本文操作环境：windows10系统、Vue2.9.6版，DELL G3电脑。
vue为什么使用setup
vue3中的setup有什么用?
setup的设计是为了使用组合式api
为什么不用之前的组件的选项
data、computed、methods、watch 组织逻辑在大多数情况下都有效。然而，当我们的组件变得更大时，逻辑关注点的列表也会增长。这可能会导致组件难以阅读和理解，尤其是对于那些一开始就没有编写这些组件的人来说。而通过setup可以将该部分抽离成函数,让其他开发者就不用关心该部分逻辑了.
setup的在vue生命周期的位置
setup位于created 和beforeCreated只前,用于代替created 和beforeCreated,但是在setup函数里不能访问到this,另外setup内可以通过以下hook操作整个生命周期
setup可以接收哪些参数?
setup可接受props,context,其中props由于是响应式数据,不能直接解构赋值,context不是响应式数据,可以直接解构赋值;setup必须返回一个对象,一旦return,就可以像vue2.x的方式使用该属性
props:['test']setup(props,context){//const{test}=props//错const{test}=toRefs(props)//对const{attrs,slots,emit}=context//对return{test}}
优先级,如果data,props,setup都有一个同名属性,setup返回的该属性优先级最高,以执行以下代码为例,将显示:test from son's setup
为了封装复用性
工程或者应用不能只谈实现，还要考虑持续集成和多人协作，前端之前由于业务复杂度太低，所以你用组件化，或者撑死了上个全局状态管理，能够解决问题，最多也就费点手但是现在不太行了，前后端接口调用太浪费效率，所以非常有必要有更好的架构，让前端能够有完整的封装复用性支撑（也就是完全编程能力），这样才能 hold 住集群中视图服务的位置
“vue中setup有什么作用”的内容就介绍到这里了，感谢大家的阅读。如果想了解更多行业相关的知识可以关注恰卡编程网网站，小编将为大家输出更多高质量的实用文章！
