当前位置： 首页 > news >正文

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

news 2026/5/13 0:02:31

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

总时长 23:40:00 共116P

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

文章目录

    • vue3使用介绍
    • 插值表达式例子
      • 时间戳
      • 随机数
      • 输出函数的值
    • ref响应式数据变量
    • v-bind 绑定
      • 手写一个轮播图
      • 绑定 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（内联样式）

在这里插入图片描述

相关文章：

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

零基础入门uniapp Vue3组合式API版本到咸虾米壁纸项目实战，开发打包微信小程序、抖音小程序、H5、安卓APP客户端等 总时长 23:40:00 共116P 此文章包含第11p-第p14的内容 文章目录 vue3使用介绍插值表达式例子时间戳随机数输出函数的值 ref响应式数据变量v-bind 绑…...

编程日记 2024/10/1 5:03:04

计算机毕业设计 基于深度学习的短视频内容理解与推荐系统的设计与实现 Python+Django+Vue 前后端分离 附源码 讲解 文档

🍊作者：计算机编程-吉哥 🍊简介：专业从事JavaWeb程序开发，微信小程序开发，定制化项目、 源码、代码讲解、文档撰写、ppt制作。做自己喜欢的事，生活就是快乐的。 🍊心愿：点…...

编程日记 2024/10/1 5:02:03

JavaScript网页设计案例深度解析：从理论到实践

前言 在现代前端开发中，JavaScript 是赋予网页生命的关键技术。静态的 HTML 和 CSS 虽然能创建美观的页面，但当我们需要增强用户交互和页面响应时，JavaScript 无疑成为最得力的工具。从程序员的角度来看，JavaScript 设计不仅仅是…...

编程日记 2024/10/1 5:01:02

spark-sql建表数据同步到hive

1、基础环境 组件版本备注hadoop3.4.0官方下载hive3.1.3自编译sparkspark-3.5.3-bin-hadoop3官方下载，需要内置hive的jar相关内容paimon0.9.0Maven官方下载jdk1.8.0_41maven3.9.6固定版本 2、停止服务、清理日志 先停止，清理数据 sudo kill -9 $(ps -ef…...

编程日记 2024/10/1 5:00:00

Django上下文处理器

1创建 （如frontend目录下）category_processors文件： def categories(request):from backend.models import Categorycategory_list Category.objects.all()return {category_list:category_list}这里，必须返回一个字典。 2&…...

编程日记 2024/10/1 4:58:59

旭升集团携手纷享销客，构建全方位客户关系管理平台

宁波旭升集团股份有限公司（以下简称“旭升集团”）自2003年成立，总部位于中国宁波，集团设有压铸、锻造、挤压、集成四大事业部，在亚洲、欧洲、美洲等地均设立研发中心及制造基地，产品主要覆盖新能源汽车的电…...

编程日记 2024/10/1 4:55:57

uniapp 知识点

自定义导航 在page.json navigationstyle":"custom"navigateTo传参 页面传参只能onLoad(option)里面拿 px和upx的关系 在750设计图中，1px1upx 路由 navigateBack返回上一页 重定向 其实就是把当前页面干掉了 公共组件和页面共同点 computed,watc…...

编程日记 2024/10/1 4:54:56

慢病中医药膳养生食疗管理微信小程序、基于微信小程序的慢病中医药膳养生食疗管理系统设计与实现、中医药膳养生食疗管理微信小程序的开发与应用（源码+文档+定制）

博主介绍： ✌我是阿龙，一名专注于Java技术领域的程序员，全网拥有10W粉丝。作为CSDN特邀作者、博客专家、新星计划导师，我在计算机毕业设计开发方面积累了丰富的经验。同时，我也是掘金、华为云、阿里云、InfoQ等平台…...

编程日记 2024/10/1 4:52:54

解决 Android WebView 无法加载 H5 页面常见问题的实用指南

目录 1. WebView 简介 2. 常见问题 3. 网络权限设置 4. 启用 JavaScript 5. DOM Storage 的重要性 6. 处理 HTTPS 问题 7. 设置 WebViewClient 8. 调试工具 9. 其他调试技巧 10. 结论 相关推荐 1. WebView 简介 Android WebView 是一种视图组件，使得 And…...

编程日记 2024/10/1 4:51:53

Ollama本地部署大模型及应用

文章目录 前言一、下载安装1.Mac2.Windows3.linux4.docker5.修改配置（可选）1.linux系统2.window 系统3.mac系统 二、Ollama使用1.命令2.模型下载3.自定义模型4.API 服务 三、Open WebUI 使用四、Dify使用 前言 Ollama 是一个专注于本地部署大型语言模型…...

编程日记 2024/10/1 4:50:50

读代码UNET

这个后面这个大小怎么算的，这参数怎么填，怎么来的？ 这是怎么看怎么算的？ 这些参数设置怎么设置？卷积多大，有什么讲究？...

编程日记 2024/10/1 4:49:49

【java】前端RSA加密后端解密

目录 1. 说明2. 前端示例3. 后端示例3.1 pom依赖3.2 后端结构图3.3 DecryptHttpInputMessage3.4 ApiCryptoProperties3.5 TestController3.6 ApiCryptoUtil3.7 ApiDecryptParamResolver3.8 ApiDecryptRequestBodyAdvice3.9 ApiDecryptRsa3.10 ApiCryptoProperties3.11 KeyPair3…...

编程日记 2024/10/1 4:47:47

机器学习 | Scikit Learn中的普通最小二乘法和岭回归

在统计建模中，普通最小二乘法（OLS）和岭回归是两种广泛使用的线性回归分析技术。OLS是一种传统的方法，它通过最小化预测值和实际值之间的平方误差之和来找到数据的最佳拟合线。然而，OLS可以遭受高方差和过拟合时&#x…...

编程日记 2024/10/1 4:46:46

代码随想录冲冲冲 Day60 图论Part11

97. 小明逛公园 floyd算法 其实就是先用i和j拼成一个平面 然后看每次从i到j距离 这里分两种情况 1.中间没有经过别的点 2.中间有经过别的点 那么最小步数就要取这两个的最小值 所有根本逻辑是i j确定一个面 再通过不同的k去看每一个中间点 所以k要在最外层 上一次的值要…...

编程日记 2024/10/1 4:45:44

golang web笔记-1.创建Web Server和Handler请求

1. 创建http web server的两个方法 1.1. 方式一：http.ListenAndServe(addr string, handler Handler) addr string：监听地址，如果为"" ,那么就是所有网络接口的80接口handler Handler：如果为nil，那么就是D…...

编程日记 2024/10/1 4:43:43

【Python】Copier：高效的项目模板化工具

Copier 是一个开源的 Python 工具，用于基于项目模板快速生成新项目。它通过灵活的模板化系统，使开发者可以快速创建、维护和更新项目模板，从而自动化项目的初始化流程。无论是简单的文件复制，还是复杂的项目结构配置，C…...

编程日记 2024/10/1 4:41:40

Spring系列 BeanPostProcessor

文章目录 BeanPostProcessor注册时机执行时机 InstantiationAwareBeanPostProcessorSmartInstantiationAwareBeanPostProcessor 本文源码基于spring-beans-5.3.31 参考：https://docs.spring.io/spring-framework/reference/core/beans/factory-extension.html#beans…...

编程日记 2024/10/1 4:38:37

Qualitor processVariavel.php 未授权命令注入漏洞复现(CVE-2023-47253)

0x01 漏洞概述 Qualitor 8.20及之前版本存在命令注入漏洞,远程攻击者可利用该漏洞通过PHP代码执行任意代码。 0x02 复现环境 FOFA：app"Qualitor-Web" 0x03 漏洞复现 PoC GET /html/ad/adpesquisasql/request/processVariavel.php?gridValoresPopHi…...

编程日记 2024/10/1 4:35:34

SpringBoot的概述与搭建

目录 一.SpringBoot的概述 二.SpringBoot 特点 三.SpringBoot 的核心功能 3.1起步依赖 3.2自动配置 四.SpringBoot 开发环境构建 五.SpringBoot 配置文件 六.SpringBoot数据访问管理 七.springboot注解 八.springboot集成mybatis 九.springboot全局异常捕获与处理 一…...

编程日记 2024/10/1 4:34:33

视频集成与融合项目中需要视频编码，但是分辨率不兼容怎么办？

在众多视频整合项目中，一个显著的趋势是融合多元化的视频资源，以实现统一监管与灵活调度。这一需求促使项目团队不断探索新的集成方案，确保不同来源的视频流能够无缝对接，共同服务于统一的调看与管理平台，进而提升整体…...

编程日记 2024/10/1 4:32:31

告别轮询与中断：用HC32F4A0的AOS+DMA实现多通道ADC的“无感”采集

HC32F4A0的AOSDMA架构：构建零CPU干预的多通道ADC采集系统 在嵌入式数据采集领域，实时性与低功耗始终是工程师需要平衡的核心矛盾。传统基于轮询或中断的ADC采集方案往往面临两大困境：要么因频繁查询浪费CPU资源，要么因中断响应延迟…...

编程新知 2026/5/12 23:38:16

TextInputLayout实战：从属性解析到自定义样式进阶

1. TextInputLayout基础入门：从零开始掌握Material输入框 第一次接触TextInputLayout时，我被它丝滑的浮动提示动画惊艳到了。相比传统的EditText，这个Material Design组件确实能让表单界面瞬间提升好几个档次。记得去年做登录页面重构时&…...

编程新知 2026/5/12 23:33:47

【研报 A114】2026人工智能时代企业技能管理数字化转型白皮书：AI驱动全生命周期闭环，迭代速度提升70%

摘要：智能汽车产业加速升级，车企正面临员工技能迭代的核心挑战，AI 原生技能管理成为转型关键。依托生成式 AI、多智能体等技术，全新的技能管理体系贯穿技能梳理、培养、评估、应用全生命周期，将技能转化为车企的核心无…...

编程新知 2026/5/12 21:47:51

保姆级教程：用Intel官方工具搞定Realsense D435深度不准和黑点问题

深度视觉优化实战：Intel RealSense D435深度校准全流程解析 刚拆封的RealSense D435摄像头在深度模式下出现零星黑点？深度图某些区域数值明显失真？这些问题往往不是硬件缺陷，而是出厂校准参数与实际使用环境不匹配导致的。作为计算…...

编程新知 2026/5/12 21:28:58

告别桌面混乱！Ubuntu 16.04 多桌面+Terminator分屏，打造程序员高效工作流

Ubuntu 16.04多桌面与Terminator分屏：构建程序员的高效工作流 作为一名长期在Ubuntu环境下工作的开发者，我深刻体会到工作环境配置对效率的影响。桌面混乱、窗口堆叠、频繁切换不仅浪费时间，还会打断编程的"心流"状态。经过多次迭代…...

编程新知 2026/5/12 21:18:05

应用间自动化网关：构建私有化、可编程的跨平台工作流中枢

1. 项目概述与核心价值最近在折腾一些跨平台、跨设备的自动化流程，发现一个痛点：不同应用、不同服务之间的数据流转，经常需要手动“搭桥”。比如，想把手机上的一个链接快速推送到电脑上处理，或者把某个文档从A服务同步…...

编程新知 2026/5/12 21:01:38

通用大模型vs行业垂直AI Agent，制造业落地对比：2026年企业级智能体选型深度解析

进入2026年，人工智能在制造业的落地已从早期的“对话式交互”全面转向“任务式闭环”。通用大模型（Foundation Models）与行业垂直AI Agent（Vertical AI Agents）在工业场景中的角色分工日益明确。根据IDC最新发布的《20…...

编程新知 2026/5/12 20:57:31

计算机视觉导航评估框架：从算法指标到用户体验的完整闭环

1. 项目概述：为什么我们需要一个“导航评估框架”？在计算机视觉辅助视障人士导航这个领域，我见过太多“实验室里的英雄”和“现实中的矮子”。一个算法在精心布置的走廊里识别障碍物准确率高达99.9%，但一到人潮涌动的火车站广场&a…...

编程新知 2026/5/12 20:35:06

3分钟搞定浏览器二维码：Chrome QRCode插件的终极使用秘籍

3分钟搞定浏览器二维码：Chrome QRCode插件的终极使用秘籍 【免费下载链接】chrome-qrcode :zap: A Chrome plugin to Genrate QRCode of URL / Text, or Decode the QRcode in website. 一个Chrome浏览器插件，用于生成当前URL或者选中内容的二维码&#…...

编程新知 2026/5/12 20:28:50

告别训练中断：在PyCharm中利用Tmux实现远程GPU服务器的持久化会话

1. 为什么需要持久化训练会话？ 作为一名长期在深度学习领域摸爬滚打的工程师，我最头疼的就是训练过程中突然断网或者需要关闭电脑的情况。想象一下，你正在用PyCharm远程连接公司的GPU服务器训练一个需要48小时的模型，突然家里停电…...

编程新知 2026/5/12 19:28:42