vue3基础

vue3的优势

作为我们应该注重了解源码和新的特性

新的特性我们挨着来了解

首先是创建工程

第一种方式也是命令行 直接vue create 文件名创建vue3

第二种可以vite创建

也是直接命令行创建和第一种差不多

首先是组合式CompositionApi

vue3中新的写法就是全部写在setup函数中很方便

代码示例如下:

setup(){

let name =ref("张三")

let age = ref(18)

let job = ref({

type:"前端工程师",

salary:"30k"

})

function sayHello(){

alert(`我叫{name},今年{age}岁`)

}

function changInfo(){

name.value='李四'

age.value = 20

job.value.type="UI工程师"

job.value.salary="40k"

console.log(name,age)

}

return{

name,

age,

job,

sayHello,

changInfo

}

}

将一切都定义在里面,然后最后return出去,外面直接用,如果要使用响应式的一定要用ref把数据包裹

调用时候是xxx.value

相关推荐
遇见~未来3 分钟前
JavaScript构造函数与Class终极指南
开发语言·javascript·原型模式
清风ai明月18 分钟前
在vue3中Promise是什么
vue.js
疯狂踩坑人27 分钟前
【React 19 尝鲜】第一篇:use和useActionState
前端·react.js
毕设源码-邱学长30 分钟前
【开题答辩全过程】以 基于VUE的打车系统的设计与实现为例,包含答辩的问题和答案
前端·javascript·vue.js
用户390513321928833 分钟前
JS判断空值只知道“||”?不如来试试这个操作符
前端·javascript
海云前端134 分钟前
前端面试必问 asyncawait 到底要不要加 trycatch 90% 人踩坑 求职加分技巧揭秘
前端
麦麦大数据1 小时前
J009 美食推荐可视化大数据系统vue+springboot
vue.js·spring boot·mysql·推荐算法·美食·可视化分析·沙箱支付
rfidunion1 小时前
springboot+VUE+部署(1。新建项目)
java·vue.js·spring boot
wuk9981 小时前
梁非线性动力学方程MATLAB编程实现
前端·javascript·matlab
Irene19911 小时前
在 Vue 中使用 TypeScript 的几种方式
vue.js·typescript