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

vue3相关内容

ref声明/赋值

操作基本类型数据 string number

// 引入方法
import {ref} from 'vue'
// 声明变量
const name = ref('A')
// 修改值
name.value = 'B'

reactive声明/赋值

操作引用类型数据 array object
proxy不能直接赋值,会破坏响应式对象

// 引入方法
import {reactive} from 'vue'
// 声明变量
const infoObj = reactive({title: '小记',date: '2023-11-17'
})
// 修改值
const changeInfo = ()=>{infoObj.title = '小记-修改'infoObj.date = '2023-11-17-修改'
}

hooks模块化抽离

HelloWorld.ts

import { reactive } from "vue";export default () => {const infoObj = reactive({title: '小记',date: '2023-11-17'})const changeInfo = ()=>{infoObj.title = '小记-修改'infoObj.date = '2023-11-17-修改'}return { infoObj, changeInfo}
};

HelloWorld.vue

<template><button @click="changeInfo">修改信息</button><div>标题:{{infoObj.title}}</div><div>日期:{{infoObj.date}}</div>
</template>
<script setup lang="ts">import HelloWorld from './HelloWorld'//自动识别后缀ts的文件const {infoObj, changeInfo} = HelloWorld()
</script>

相关文章:

vue3相关内容

ref声明/赋值 操作基本类型数据 string number // 引入方法 import {ref} from vue // 声明变量 const name ref(A) // 修改值 name.value Breactive声明/赋值 操作引用类型数据 array object proxy不能直接赋值&#xff0c;会破坏响应式对象 // 引入方法 import {reacti…...

AWTK实现汽车仪表Cluster/DashBoard嵌入式GUI开发(七):FreeRTOS移植

前言: 一般的GUI工程都需要一个操作系统,可能是linux,重量级的,也可能是FreeRTOS,轻量级的。 一句话理解那就是工程就是FreeRTOS task任务的集合。 一个main函数可以看到大框架: 很显然,除了第一个是硬件配置的初始化,中间最重要的部分就是要创建任务,把AWTK的应用…...

《洛谷深入浅出进阶篇》P1995 程序自动分析——并查集,离散化

上链接&#xff1a;P1955 [NOI2015] 程序自动分析 - 洛谷 | 计算机科学教育新生态 (luogu.com.cn)https://www.luogu.com.cn/problem/P1955 上题干&#xff1a; 首先给你一个整数t&#xff0c;代表t次操作。 每一次操作包含以下内容&#xff1a; 1.给你一个整数n&#xff0c;让…...

基于单片机的自动循迹小车(论文+源码)

1.系统设计 此次基于单片机的自动循迹小车的设计系统&#xff0c;结合循迹模块来共同完成本次设计&#xff0c;实现小车的循迹功能&#xff0c;其其整体框架如图2.1所示。其中&#xff0c;采用STC89C52单片机来作为核心控制器&#xff0c;负责将各个传感器等模块链接起来&…...

linux系统中安装python到指定目录

Linux系统中安装python 下载Python源码包 根据服务器系统和需要的Python版本&#xff0c;在Python官网下载对应的Python源码包。 安装依赖&#xff08;需要权限&#xff09; yum install gcc gcc-c patch libffi-devel python-devel zlib-devel bzip2-devel openssl-devel…...

分布式事务 - seata安装

分布式事务 - seata 一、本地事务与分布式事务 1.1、本地事务 本地事务&#xff0c;也就是传统的单机事务。在传统数据库事务中&#xff0c;必须要满足四个原则&#xff08;ACID&#xff09;。 1.2、分布式事务 分布式事务&#xff0c;就是指不是在单个服务或单个数据库架构…...

CentOS to 浪潮信息 KeyarchOS 迁移体验与优化建议

浪潮信息KeyarchOS简介 KeyarchOS即云峦操作系统(简称KOS), 是浪潮信息研发的一款面向政企、金融等企业级用户的 Linux 服务器操作系统。它基于Linux内核、龙蜥等开源技术&#xff0c;支持x86、ARM 等主流架构处理器&#xff0c;其稳定性、安全性、兼容性和性能等核心能力均已…...

Go解析soap数据和修改其中数据

一、解析soap数据 package main import ("fmt" "encoding/xml" ) type Envelope struct { XMLName xml.Name Header Header } type Header struct { XMLName xml.Name xml:"Header" Security Security xml:"Security" } type Secu…...

LeetCode98. Validate Binary Search Tree

文章目录 一、题目二、题解 一、题目 Given the root of a binary tree, determine if it is a valid binary search tree (BST). A valid BST is defined as follows: The left subtree of a node contains only nodes with keys less than the node’s key. The right sub…...

【LeetCode】206. 反转链表

206. 反转链表 难度&#xff1a;简单 题目 给你单链表的头节点 head &#xff0c;请你反转链表&#xff0c;并返回反转后的链表。 示例 1&#xff1a; 输入&#xff1a;head [1,2,3,4,5] 输出&#xff1a;[5,4,3,2,1]示例 2&#xff1a; 输入&#xff1a;head [1,2] 输…...

飞天使-通过GET 和POST进案例演示

文章目录 GETPOST GET def index(request):# 在url中获取学号sno request.GET.get("sno", None)print("学号为&#xff1a;",sno)# 判断学号如果有值&#xff0c;执行查询if sno:results get_student_by_sno(sno)# 展示在页面return render(request, ind…...

【MySql】12- 实践篇(十)

文章目录 1. 为什么临时表可以重名?1.1 临时表的特性1.2 临时表的应用1.3 为什么临时表可以重名&#xff1f;1.4 临时表和主备复制 2. MySql内部临时表使用场景2.1 union 执行流程2.2 group by 执行流程2.3 group by 优化方法 -- 索引2.4 group by 优化方法 -- 直接排序 3. Me…...

<C++> 反向迭代器

我们知道正向迭代器的设计&#xff1a;begin迭代器指向第一个数据&#xff0c;end迭代器指向最后一个数据的下一个位置 。移向下一个数据&#xff0c;解引用得到数据的值&#xff0c;并根据容器储存方式的不同&#xff0c;容器有不同类型的迭代器。 注意&#xff1a;rbegin迭代…...

【EI会议征稿】第三届网络安全、人工智能与数字经济国际学术会议(CSAIDE 2024)

第三届网络安全、人工智能与数字经济国际学术会议&#xff08;CSAIDE 2024&#xff09; 2024 3rd International Conference on Cyber Security, Artificial Intelligence and Digital Economy 第三届网络安全、人工智能与数字经济国际学术会议&#xff08;CSAIDE 2024&#…...

格力报案称“高管遭自媒体侮辱诽谤”

我是卢松松&#xff0c;点点上面的头像&#xff0c;欢迎关注我哦&#xff01; 王自如的一番话引来了众多围攻&#xff0c;格力已报警&#xff0c;高管遭到侮辱诽谤。这应该是近年来少见的大企业和网络大v之间公开翻脸互撕的场景了! 就在今天格力就高管遭自媒体侮辱诽谤报案。…...

HBase之Compaction

目录 Compaction触发条件相关参数 文件选取策略ExploringCompactionPolicy常见优化 Compaction 随着memstore的不断flush&#xff0c;storefile的数量将会不断增加。compaction将通过合并storefile来减少文件数量&#xff0c;并提高读性能。conpaction以store为单位 Compacti…...

设计模式之结构型模式

这些模式关注对象之间的组合和关联方式&#xff0c;以便形成更大的结构和功能。 适配器模式&#xff08;Adapter Pattern&#xff09;桥接模式&#xff08;Bridge&#xff09;装饰器模式&#xff08;Decorator&#xff09;组合模式&#xff08;Composite&#xff09;外观模式&a…...

centOs 6.10 编译 qt 5.15.11

安装依赖库 xcb 依赖库 qt xcb 需要的依赖 如何要用 x11, 就要在编译的时候加上 -xcb 选项&#xff0c;就要安装 xcb 相关的库。 到时可以在 config.log 文件查看&#xff0c;缺少哪个库就安装哪个。 下面是我手动安装的库和对应版本&#xff1a; xcb-proto-1.14.tar.gz x…...

Redis对象的数据结构及其原理汇总

本文首发于公众号&#xff1a;Hunter后端 原文链接&#xff1a;Redis对象的数据结构及其底层实现原理汇总 当我们被问到 Redis 中有什么数据结构&#xff0c;或者说数据类型&#xff0c;我们可能会说有字符串、列表、哈希、集合、有序集合。 其实这几种数据类型在 Redis 中都由…...

@RestController 注解网页返回 [] ,出现的bug

RestController 注解网页返回 [] ,出现的bug RestController RequestMapping("emp") public class EmployeeController {Autowiredprivate EmployeeService employeeService;GetMapping("find")public List<Employee> find(){List<Employee> …...

为什么你的Pyd文件在Windows上总报“DLL加载失败”?系统级依赖扫描、Manifest嵌入与UCRT版本对齐终极方案

第一章&#xff1a;Pyd文件在Windows上的本质与加载机制Pyd 文件是 Windows 平台上 Python 的 C 扩展模块的二进制格式&#xff0c;其本质是遵循特定 ABI 约束的动态链接库&#xff08;DLL&#xff09;&#xff0c;但被 Python 解释器以特殊方式识别和加载。它并非普通 DLL&…...

如何让鼠标和触控板和平共处:Scroll Reverser实现设备独立控制的效率革命

如何让鼠标和触控板和平共处&#xff1a;Scroll Reverser实现设备独立控制的效率革命 【免费下载链接】Scroll-Reverser Per-device scrolling prefs on macOS. 项目地址: https://gitcode.com/gh_mirrors/sc/Scroll-Reverser 在多设备协同办公成为常态的今天&#xff0…...

【STM32实战】步进电机S型曲线算法优化与误差补偿策略

1. 为什么需要S型曲线算法 我第一次用步进电机做项目时&#xff0c;直接给电机发固定频率的脉冲让它转起来。结果电机启动瞬间发出"咔咔"的异响&#xff0c;运行起来也一顿一顿的。后来才知道&#xff0c;步进电机最怕的就是突然加速或急停&#xff0c;这会导致丢步、…...

PostgreSQL权限管理实操:Homebrew安装后,如何正确创建postgres用户并导入项目数据

PostgreSQL权限管理实战&#xff1a;从Homebrew安装到项目数据迁移全指南 当你用Homebrew完成PostgreSQL安装后&#xff0c;真正的挑战才刚刚开始。许多开发者卡在权限配置这一关&#xff0c;导致后续数据迁移和日常操作频频受阻。本文将带你深入PostgreSQL的权限体系&#xff…...

LangGPT:革新自然语言编程的结构化提示词框架

LangGPT&#xff1a;革新自然语言编程的结构化提示词框架 【免费下载链接】LangGPT LangGPT: Empowering everyone to become a prompt expert!&#x1f680; Structured Prompt&#xff0c;Language of GPT, 结构化提示词&#xff0c;结构化Prompt 项目地址: https://gitcod…...

CTE、临时表、子查询如何选?

在 SQL Server 等关系型数据库中&#xff0c;处理复杂查询逻辑时&#xff0c;子查询 (Subquery)、临时表 (Temporary Table) 和公共表表达式 (CTE, Common Table Expression) 是三种核心工具。它们各有优劣&#xff0c;选择哪种取决于具体的性能需求、数据规模、代码可读性以及…...

STM32在博物馆环境监测系统中的应用设计

基于STM32的博物馆文物展柜环境监测与控制系统设计1. 项目概述1.1 系统架构本系统采用STM32F103RCT6作为主控制器&#xff0c;构建了一套完整的文物展柜环境监测与控制解决方案。系统通过集成多种传感器和执行机构&#xff0c;实现了对展柜内温度、湿度及光照强度的实时监测与自…...

Django REST framework的应用场景

目录一、鉴权开发框架介绍二、Django REST framework是什么三、如何实现认证、权限与限流功能四、Django REST framework的应用场景一、鉴权开发框架介绍 鉴权开发框架是一种用于实现身份验证和授权的软件开发工具。它可以帮助开发者快速构建安全、可靠的身份验证和授权系统&a…...

Jable视频下载终极指南:3步免费保存你喜欢的视频内容

Jable视频下载终极指南&#xff1a;3步免费保存你喜欢的视频内容 【免费下载链接】jable-download 方便下载jable的小工具 项目地址: https://gitcode.com/gh_mirrors/ja/jable-download jable-download是一款专为Jable.tv视频平台设计的免费下载工具&#xff0c;通过Ch…...

从人工到智能:SubtitleOCR如何实现硬字幕提取的效率革命

从人工到智能&#xff1a;SubtitleOCR如何实现硬字幕提取的效率革命 【免费下载链接】SubtitleOCR 快如闪电的硬字幕提取工具。仅需苹果M1芯片或英伟达3060显卡即可达到10倍速提取。A very fast tool for video hardcode subtitle extraction 项目地址: https://gitcode.com/…...