vue3使用setup代替created
阅读数:151 评论数:0
跳转到新版页面分类
html/css/js
正文
<script>
export default {
setup() {
const func1= () => {
console.log("func1");
}
func1(); //因为setup()即相当于created: 所以直接调用就行了
return {
};
},
}
</script>
使用setup语法糖
<script lang="ts" setup>
const func1= () => {
console.log("func1");
}
func1(); //因为setup即相当于created:
</script>
相关推荐
一、概述
<script setup> 是在单文件组件（SFC）中使用组合式API的编译时语法糖，解决Vue3.0中setup需要频繁将声明的变量、函数以及import引入的内容通过return向外
一、生命周期
1、vue2生命周期
beforeCreate #实例初始化之后,进行数据侦听和事件/侦听器的配置之前同步调用
created #实例创建完成后被立即同步调用
beforeMount #
一、使用pnpm新建项目
可以使用npm 或yarn或pnpm来初始化Vite项目
pnpm create vite xxx(项目名称)
#选择vue
#选择js
cd xxx (进入项目目录)
#安
一、概述
在vue2中，data函数里返回的值直接为响应式，但在vue3中我们需要使用一些函数才能达到这个效果。
setup函数中拿不到vue的this。
二、常用函数
<template>
<d
缓存页面主要Jul为了防止重复渲染dom，减少加载时间及性能消耗，提高用户体验。
一、旧版的语法
<keep-alive>
<router-view v-if="$route.meta.kee
一、在main.js挂载
import { createApp } from 'vue'
import App from './App.vue'
import router from './route
一、概述
在vue3中没有$refs这个对象，可以使用如下方法
<template>
<div><input type="text" ref="txt1" value="hello" /></div>
方式一、全局引入
全局引入element之后事，element已经在app.config.globalProperties添加了全局方法$message，所以可以在组件中直接使用。
方式二、按需引入
一、useRouter传参的方式
1、隐匿传参params
import { useRouter } from 'vue-router'
export default {
setup() {
方案一：
使用app.config.globalProperties.
// 初始化相关
import { createApp } from 'vue'
import { nextTick } fro