广告：宝塔服务器面板，一键全能部署及管理，送你10850元礼包，点我领取~~~

Composition Api setup函数是一个新的组件选项。作为在组件内使用Composition API的入口点。 调用时机： setup函数会在beforeCreate钩子之前被调用 返回值 如果setup返回一个对象，则对象的属性可以在组件模板中被访问 参数 接收俩个参数

setup.vue

<template><div>setup</div></template> <script>export default{setup(){console.log('setup.....')},beforeCreate() {console.log('beforeCreate...')},}</script> <style></style>

app.vue

 <template><comp-setup></comp-setup></template> <script>/*eslint no-mixed-spaces-and-tabs: ["error", "smart-tabs"]*/import CompSetup from './components/setupview'export default {  name: 'App',  components: {  CompSetup,  }}</script> <style> </style>

接收参数：

setup.vue

<template><div>{{ name }}<p>{{ user.username }}</p></div></template> <script>export default{//setup不能访问this//可以接收参数setup(props,context){// console.log('setup.....')//这种返回的数据不具有响应式// let name='tom'// return {// name,// }return {name:'tom',user:{username:'admin',password:'123'}}},beforeCreate() {// console.log('beforeCreate...')},props:{msg:String}}</script> <style></style>

app.vue

<template><comp-setup msg="welcome"></comp-setup></template><script>/*eslint no-mixed-spaces-and-tabs: ["error", "smart-tabs"]*/import CompSetup from './components/setupview'export default {  name: 'App',  components: {  CompSetup,  }}</script><style></style>

【相关推荐：vue.js视频教程】

以上就是简析Vue3的setup函数（入口点）的详细内容，更多请关注9543建站博客其它相关文章！