Vue3拒绝写return，用setup语法糖，让写Vue3

　　1。在template中直接使用声明的变量、函数以及import引入的内容｛｛msg｝｝
　　｛｛getToday（）｝｝复制代码li标准组件｛｛msg｝｝
　　｛｛getToday（）｝｝复制代码总结：复制代码（scriptsetup标签最终都会编译成setup（）函数的内容，每次实例化组件，就是实例化一次setup函数。script标签里面的setup函数也是一样每次实例化组件，就是实例化一次setup函数，但是script标签setup是需要写在exportdefault｛｝内的，外的只是首次引入的时候执行一次）ul2、复制代码codepre3、组件通信：在复制代码codepre
　　子组件：中可以直接使用父组件传递的props（可省略props。）复制代码codepredefineEmit代替emit，子组件向父组件传递数据（子组件向外暴露数据）
　　子组件代码：template子组件buttonclicktoEmits子组件向外暴露数据buttontemplate复制代码
　　父组件代码：template父组件ChildchildFnchildFnp接收子组件传递的数据｛｛childData｝｝template复制代码4。复制代码codepre
　　父组件代码：template父组件ChildrefchildRefbuttonclickgetChildData通过ref获取子组件的属性buttontemplate复制代码5。语法糖其他功能useSlots和useAttrs（少用，由于大部分人是SFC模式开发，在通过标签就可以渲染插槽）如果需要在scriptsetup中使用slots和attrs需要用useSlots和useAttrs替代需要引入：import｛useSlots，useAttrs｝formvue在中通过slots和attrs来访问更方便（attrs用来获取父组件中非props的传递到子组件的参数方法，attrs用来获取父组件中非props的传递到子组件的参数方法，attrs用来获取父组件中非props的传递到子组件的参数方法，slots可以获取父组件中插槽传递的虚拟dom对象，在SFC模式应该用处不大，在JSXTSX使用比较多）父组件：默认插槽具名插槽作用域插槽姓名：｛｛scope。name｝｝，年龄｛｛scope。age｝｝复制代码子组件：｛｛attrs。msgattrs。msg｝｝
　　｛｛slotsslots｝｝复制代码useSlots或许在JSXTSX下更实用想使用JSX语法在vite需要下载相关jsx的plugins才能识别jsxuseSlots可以获取父组件传递过来插槽的虚拟dom对象，可以用来渲染插槽内容复制代码大部分人是SFC模式开发，在通过标签就可以渲染插槽，这种JSX的写法应该是很少人会使用的
　　总结：setup的语法糖作为Vue3的补充，让Vue3更加丰满，让我们写Vue3更爽。如果觉得写得还不错不吝啬给点给赞再走吧！
　　作者：我要充满正能量
　　链接：https：juejin。cnpost7078865301856583717