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

相关推荐
!执行4 分钟前
高德地图 JS API 在 Linux 系统的兼容性解决方案
linux·前端·javascript
Gooooo7 分钟前
现代浏览器的工作原理
前端
发现一只大呆瓜10 分钟前
JS-ES6新特性
javascript
kk晏然33 分钟前
TypeScript 错误类型检查,前端ts错误指南
前端·react native·typescript·react
纆兰43 分钟前
汇款单的完成
前端·javascript·html
Lsx_1 小时前
案例+图解带你遨游 Canvas 2D绘图 Fabric.js🔥🔥(5W+字)
前端·javascript·canvas
2501_944521001 小时前
rn_for_openharmony商城项目app实战-主题设置实现
javascript·数据库·react native·react.js·ecmascript
北辰alk1 小时前
Vue 路由跳转完全指南:8种跳转方式深度解析
vue.js
北辰alk1 小时前
Vue v-for 遍历对象顺序完全指南:从混乱到可控
vue.js
m0_471199631 小时前
【场景】如何快速接手一个前端项目
前端·vue.js·react.js