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

相关推荐
江城开朗的豌豆8 分钟前
JavaScript篇:typeof 的魔法:原来你是这样判断类型的!
前端·javascript·面试
江城开朗的豌豆11 分钟前
JavaScript篇:数组扁平化:从‘千层饼’到‘一马平川’的六种神操作 🥞→📜
前端·javascript·面试
当归10241 小时前
Fuse.js:打造极致模糊搜索体验
开发语言·javascript·ecmascript
難釋懷2 小时前
Vue-Todo-list 案例
前端·vue.js·list
前端达人2 小时前
React 播客专栏 Vol.18|React 第二阶段复习 · 样式与 Hooks 全面整合
前端·javascript·react.js·前端框架·ecmascript
GISer_Jing2 小时前
Monorepo 详解:现代前端工程的架构革命
前端·javascript·架构
比特森林探险记3 小时前
Go Gin框架深度解析:高性能Web开发实践
前端·golang·gin
前端百草阁6 小时前
JavaScript 模块系统:CJS/AMD/UMD/ESM
javascript·ecmascript
打小就很皮...6 小时前
简单实现Ajax基础应用
前端·javascript·ajax
wanhengidc7 小时前
服务器租用:高防CDN和加速CDN的区别
运维·服务器·前端