uniapp学习（003-1 vue3学习 Part.1）

零基础入门uniapp Vue3组合式API版本到咸虾米壁纸项目实战，开发打包微信小程序、抖音小程序、H5、安卓APP客户端等

总时长 23:40:00 共116P

此文章包含第11p-第p14的内容

---

文章目录

• • vue3使用介绍
  • 插值表达式例子
  • • 时间戳
    • 随机数
    • 输出函数的值
  • ref响应式数据变量
  • [v-bind 绑定](#v-bind 绑定)
  • • 手写一个轮播图
    • [绑定 class](#绑定 class)
    • 绑定style（内联样式）

vue3使用介绍

进入vue3官方文档

官网

vue3使用的是组合式api

创建vue应用

插值表达式例子

我们使用 3.2版本后的语法糖

时间戳

随机数

输出函数的值

必须加括号 否则如下

加括号之后

ref响应式数据变量

预期是每秒变化一次 这里一直是6

我们使用响应式ref就可以了

使用 变量.value可以得到数据

字符串、数组、对象 都可以定义

可以修改值的内容

这里主要使用ref ref的实现原理也是 reactive

层级较深可以使用reactive，尤其是后续需要用到数据监视的一些数据，推荐使用reactive

v-bind 绑定

v-bind:属性 可以简写成 :属性

手写一个轮播图

使用取余 但是时间长了 会溢出，但是呢，js不会把页面退出去，只会给你返回个undefined，然后继续

不加v-bind的话 false只是个字符串

绑定 class

动态变化class

我们一般使用三目表达式

绑定style（内联样式）

---