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 小时前
OpenClaw入门:从零开始搭建你的私有化AI助手
前端·架构·github
吴仰晖4 小时前
使用github copliot chat的源码学习之Chromium Compositor
前端
1024小神4 小时前
github发布pages的几种状态记录
前端
不像程序员的程序媛6 小时前
Nginx日志切分
服务器·前端·nginx
Daniel李华6 小时前
echarts使用案例
android·javascript·echarts
北原_春希6 小时前
如何在Vue3项目中引入并使用Echarts图表
前端·javascript·echarts
JY-HPS6 小时前
echarts天气折线图
javascript·vue.js·echarts
尽意啊6 小时前
echarts树图动态添加子节点
前端·javascript·echarts
吃面必吃蒜6 小时前
echarts 极坐标柱状图 如何定义柱子颜色
前端·javascript·echarts
O_oStayPositive6 小时前
Vue3使用ECharts
前端·javascript·echarts