vue3使用setup代替created

vue2中的created可使用vue3中的setup()来代替。
setup() :开始创建组件之前，在beforeCreate和created之前执行。创建的是data和method。
如果想要在页面创建时就执行方法，
vue2：

<script>
export default {components: {},data(){return{};},methods: {func1() {console.log("func1");},},created:{this.func1()  //注意vue3中已经不支持使用this.}
}
</script>

vue3:

<script>export default {setup() {const func1= () => {console.log("func1");}func1();  //因为setup()即相当于created:  所以直接调用就行了return {};},}
</script>

vue3使用setup语法糖：

<script lang="ts" setup>const func1= () => {console.log("func1");}func1();  //因为setup即相当于created:
</script>

vue3使用setup代替created相关推荐

vue3之setup的使用理解
1.vue3中的setup有什么用 setup的设计是为了使用组合式api 2.为什么不用之前的组件的选项 data.computed.methods.watch 组织逻辑在大多数情况下都有效.然而, ...
Vue3.0 setup的使用及作用
目录开篇: 1.什么是setup 2.setup怎么使用 3.setup中包含的生命周期函数 3.setup相关参数 4.setup特性总结总结开篇: 从vue2升级 vue3,vue3是可以兼 ...
vue3中setup()函数的使用二
vue3的使用 <template><div id="one"><img src="http://127.0.0.1:9000/upload ...
vue3中setup()函数的使用一
<template><div id="one"><img src="http://127.0.0.1:9000/upload/001.png ...
vue3 script setup写法
公司代码扫描要求一个函数不能超过50行,那么一般vue3写法setup函数肯定超了,又懒得写到hooks,同事介绍了去年vue3出的新的语法糖,研究了下,写篇博客简单的将,去掉了exprot def ...
便利贴--43{vue3+ts+setup+ArcoDesign 表格和表单单页模板（整合）} --舍弃--不删--不更新
便利贴--43{vue3+ts+setup+ArcoDesign 表格和表单单页模板(整合)} --舍弃--不删--不更新前言 tableOnce.vue affuxFormModal.vue 前 ...
Vue3在setup语法糖下的父子组件传值
文章目录前言一.前期准备二.初始化项目 1.父组件传值给子组件 2.子组件传值给父组件 3.完整代码总结前言 vue版本大于>3.2 使用setup语法糖一.前期准备 setup介绍 ...
剖析Vue3中setup()的用法（持续更新中）
一.setup的特性及作用可以确定的是 Vue3.0 是兼容 Vue2.x 版本的也就是说我们再日常工作中可以在 Vue3 中使用 Vue2.x 的相关语法但是不建议这样写. Vue3 的一大 ...
vue3中 setup注意点
setup执行的时机:在beforeCreate之前执行一次,this是undefined. setup参数(只能收到2个): 1 props:值为对象,包含:组件外部传递过来,且组件内部声明接收了 ...

vue3使用setup代替created

vue3使用setup代替created相关推荐

最新文章

热门文章