博客
关于我
Vue3 学习笔记 —— setup
阅读量:244 次
发布时间:2019-03-01

本文共 698 字,大约阅读时间需要 2 分钟。

setup

  • 新的 option,仅在beforeCreate之前执行一次
// setup 执行时,组件还没有开始创建,因此 this 为 undefined  setup () {       console.log('this in setup:', this)  }

在这里插入图片描述

  • 如果该函数返回对象,对象中的属性或方法,在模板中可以直接使用

在这里插入图片描述

  • setup 中返回的对象会同datamethods合并到组件对象上
export default defineComponent({     name: 'App',  setup () {       return {         inSetup: 'setup',    }  },  data() {       return {         inData: 10    }  },  methods: {       inMethods () {         console.log(123)    }  },  mounted () {       console.log(this)  }});

在这里插入图片描述

  • setup 接收两个参数 propscontext
  • props:组件声明接收,且父组件传递了的属性
  • context: 包含 attrs: 父组件传递的但未声明接收的属性、emit:用来触发自定义事件、slots: 父组件传递的插槽组件
    在这里插入图片描述
// App.vue
// Child.vue

在这里插入图片描述

转载地址:http://mpqt.baihongyu.com/

你可能感兴趣的文章
Nginx 多端口配置和访问异常问题的排查与优化
查看>>
Nginx 如何代理转发传递真实 ip 地址?
查看>>
Nginx 学习总结(16)—— 动静分离、压缩、缓存、黑白名单、性能等内容温习
查看>>
Nginx 学习总结(17)—— 8 个免费开源 Nginx 管理系统,轻松管理 Nginx 站点配置
查看>>
Nginx 学习(一):Nginx 下载和启动
查看>>
nginx 常用指令配置总结
查看>>
Nginx 常用配置清单
查看>>
nginx 常用配置记录
查看>>
nginx 开启ssl模块 [emerg] the “ssl“ parameter requires ngx_http_ssl_module in /usr/local/nginx
查看>>
Nginx 我们必须知道的那些事
查看>>
Nginx 源码完全注释(11)ngx_spinlock
查看>>
Nginx 的 proxy_pass 使用简介
查看>>
Nginx 的 SSL 模块安装
查看>>
Nginx 的优化思路,并解析网站防盗链
查看>>
Nginx 的配置文件中的 keepalive 介绍
查看>>
nginx 禁止以ip形式访问服务器
查看>>
Nginx 结合 consul 实现动态负载均衡
查看>>
Nginx 负载均衡与权重配置解析
查看>>
Nginx 负载均衡详解
查看>>
nginx 配置 单页面应用的解决方案
查看>>