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

前端流行框架Vue3教程：14. 组件传递Props效验

news 来源：原创 2025/8/18 14:44:18

(4) 组件传递Props效验

Vue组件可以更细致地声明对传入的props的校验要求

ComponentA.vue

<script>
import ComponentB from './ComponentB.vue';
export default {components: {ComponentB},data() {return {title: '标题'}}
}
</script>
<template><h3>ComponentA </h3><ComponentB :title="title"/>
</template>

ComponentB.vue

<script>
export default{data(){return{}},props:{title:{// 效验类型，可以为很多类型type:[String,Number]}}
}
</script>
<template>
<h3>ComponentB</h3>
<p>{{ title }}</p>
</template>

默认值

假设ComponentA.vue没有传入age的值：

ComponentB.vue

<script>
export default{data(){return{}},props:{title:{type:[String,Number],},age:{type:Number,default:18},// 数字和字符串可以直接default，但是如果是数组和对象，必须通过工厂函数返回默认值names:{type:Array,default(){return ['张三','李四']}}}
}
</script>
<template>
<h3>ComponentB</h3>
<p>{{ title }}</p>
<p>{{ age }}</p>
<ul><li v-for="(item,index) in names" :key="index">{{ item }}</li>
</ul>
</template>

在这里插入图片描述

必选项

部分代码:

text:{type:String,required:true  // 必选项}

我们没有传text的话，就会有个提示

在这里插入图片描述

温馨提示
警告！prop是只读的!

比如我们用button添加个事件，是不允许修改父元素传递过来的数据

前端流行框架Vue3教程：14. 组件传递Props效验

(4) 组件传递Props效验 Vue组件可以更细致地声明对传入的props的校验要求 ComponentA.vue <script> import ComponentB from ./ComponentB.vue; export default {components: {ComponentB},data() {return {title: 标题}} } </script> <template><h3&g…...

编程日记 2025/8/18 14:44:18

电子电器架构 --- 网关ECU中采用多CPU解决方案来实现网关功能

我是穿拖鞋的汉子，魔都中坚持长期主义的汽车电子工程师。老规矩，分享一段喜欢的文字，避免自己成为高知识低文化的工程师：钝感力的“钝”，不是木讷、迟钝，而是直面困境的韧劲和耐力，是面对外界噪音的通透淡然。生活中有两种人，一种人格外在意别人的眼光;另一种人无论…...

编程日记 2025/8/18 14:34:14

关于tftpboot的用法

TFTPBOOT 是一个常用于嵌入式系统或网络设备中的命令，用于通过 TFTP 协议从网络上启动操作系统镜像或引导文件。这个命令通常在设备启动时执行，允许设备通过网络从 TFTP 服务器下载启动镜像或其他必要的文件，而不需要从本地存储中启动。一般…...

编程日记 2025/8/18 14:36:08

团队协作的润滑剂——GitHub与协作流程

各位代码界的社交恐惧症患者们，今天我们要聊的是如何假装自己很会团队协作——使用GitHub！这就像程序员版的"相亲平台"，只不过在这里，你展示的不是自拍和收入，而是代码和commit记录（后者往往更令…...

编程日记 2025/8/17 8:27:17

数据库复习

DML操作包括： SELECT INSERT UPDATE DELETE MERGE 返回字符串长度：length() 查询记录：SELECT 增（INSERT）、删（DELETE）、改（UPDATE）、查（SELECT&#…...

编程日记 2025/8/17 8:29:42

AI与机器学习、深度学习在气候变化预测中的应用与实践

前言： 全球气候变化是现代社会面临的最重要的环境挑战之一，影响了气温、降水、海平面、农业、生态系统等多个方面。气候变化的驱动因素主要包括温室气体排放、气溶胶浓度、火灾频发、海冰融化、叶绿素变化、农业变化和生态环境变化等。这些因素在全球范围…...

编程日记 2025/8/17 8:29:31

Laravel 12 基于 EMQX 实现 MQTT 消息发送与接收

Laravel 12 基于 EMQX 实现 MQTT 消息发送与接收要在 Laravel 12 中实现基于 EMQX 的 MQTT 消息发送与接收，你可以按照以下步骤操作： 1. 安装必要的依赖包首先安装 MQTT 客户端库： composer require php-mqtt/client2. 配置 EMQX 连接 …...

编程日记 2025/8/17 8:27:24

论广告系统对存算分离架构的应用

辅助论点辅助论点一：存算分离架构起源于数据库领域，并不是在线系统。存算分离的架构源于Google的Spanner数据库，这个数据库采用了KV做存储层，OLAP做计算层的分离式设计，其目的是能快速伸缩计算资源，且节…...

编程日记 2025/8/17 9:16:47

create-vue搭建Vue3项目（Vue3学习2）

一、认识create-vue image.png 二、create-vue搭建Vue3项目 image.png image.png 依次执行npm install 和npm run dev即可运行项目 image.png image.png © 著作权归作者所有,转载或内容合作请联系作者喜欢的朋友记得点赞、收藏、关注哦！！&#xff…...

编程日记 2025/8/17 8:27:34

NHDEEP档案管理系统功能介绍

NHDEEP档案管理系统单机版专注于提高档案管理效率，无需网络连接即可独立运作，确保数据的安全与私密性。无论是机关单位的常规档案工作，还是工程、基建项目的特殊档案管理需求，系统都能提供全面的解决方案。系统支持信创环境。核心…...

编程日记 2025/8/18 5:41:06

【C++】C++中的命名/名字/名称空间 namespace

C中的命名/名字/名称空间 namespace 1、问题引入2、概念3、作用4、格式5、使用命名空间中的成员5.1 using编译指令（ 引进整个命名空间） ---将这个盒子全部打开5.2 using声明使特定的标识符可用(引进命名空间的某个成员) ---将这个盒子中某个成员的位置打…...

编程日记 2025/8/17 8:29:43

游戏引擎学习第260天:在性能分析器中实现钻取功能

昨天那个帧内存满之后触发段错误实在没找到什么原因导致的继续研究一下为什么导致的内存不够进来释放frame 释放frame 应该会给DebugState->FirstFreeStoredEvent 赋值吧这段宏定义： #define FREELIST_DEALLOCATE(Pointer, FreeListPointer) \if(Pointer) {…...

编程日记 2025/8/17 8:27:46

人工智能100问☞第15问：人工智能的常见分类方式有哪些？

目录一、通俗解释二、专业解析三、权威参考人工智能的常见分类方式包括：按智能水平（弱人工智能、通用人工智能、超级人工智能）、按技术原理（生成式AI、判别式AI、强化学习）、按功能目标（生成内容、优化决策）、按应用领域（自然语…...

编程日记 2025/8/17 10:15:05

JavaSE核心知识点01基础语法01-04（数组）

🤟致敬读者 🟩感谢阅读🟦笑口常开🟪生日快乐⬛早点睡觉 📘博主相关 🟧博主信息🟨博客首页🟫专栏推荐🟥活动信息文章目录 JavaSE核心知识点01基础语法01-04&#xff0…...

编程日记 2025/8/17 10:16:11

抖音代播领航者——品融电商（PINKROON）的运营实力与服务解析

抖音代播领航者——品融电商（PINKROON）的运营实力与服务解析在兴趣电商高速发展的背景下，杭州品融品牌管理有限公司（PINKROON）凭借其全域增长方法论与抖音生态的深度布局，成为众多品牌首选的抖音代播服务商…...

编程日记 2025/8/16 17:33:20

LeetCode 790 多米诺和托米诺平铺题解

对于本题不去看LeetCode的评论区和题解很难想到如何去dp，毕竟就算再怎么枚举也很难找到适用于面向结果的规律。所以对于题解我建议大家还是去看一下灵神给的题解，以下是灵神汇总的图，如果能看懂的话，对于解决题目有很大的帮助。根…...

编程日记 2025/8/17 11:39:27

力扣-hot100 (缺失的第一个正数)

41. 缺失的第一个正数困难给你一个未排序的整数数组 nums ，请你找出其中没有出现的最小的正整数。请你实现时间复杂度为 O(n) 并且只使用常数级别额外空间的解决方案。示例 1： 输入：nums [1,2,0] 输出：3 解释&#xff…...

编程日记 2025/8/17 9:19:30

Electrolink信息泄露(CVE-2025-28228)

免责声明本文档所述漏洞详情及复现方法仅限用于合法授权的安全研究和学术教育用途。任何个人或组织不得利用本文内容从事未经许可的渗透测试、网络攻击或其他违法行为。使用者应确保其行为符合相关法律法规，并取得目标系统的明确授权。对于因不当使用本文信息而造成的任何直…...

编程日记 2025/8/17 11:39:24

Leetcode Hot 100 三数之和

思路对数组先排序，然后使用双指针法进行，并且整个过程需要把握去重的逻辑代码 class Solution:def threeSum(self, nums: List[int]) -> List[List[int]]:if not nums:return []nums.sort() #去重都需要排序res[]for i in range(len(nums)):if i…...

编程日记 2025/8/17 9:39:50

5月6日日记

一点心得是看通知要仔细认真，自己想问的问题要先看看通知或者文件中说了没有，如果没说再去问相关负责人。上课的教室一定要看好，看准了再去。别像今天一样先去了科技楼又去了工学馆。线代开课了。感觉总体还行，并不是很难。…...

编程日记 2025/8/18 6:58:42

巧记英语四级单词 Unit7-中【晓艳老师版】

collapse v.倒塌，坍塌都(col)来扑(lap)噻immune a.不受影响的，免疫的我im 木讷mune，人应该木讷一点yard n.院子鸭的，在哪养；backyard 后院backward a.往后的 ward表示方向 profile n.外形，轮廓从前面看…...

编程日记 2025/8/17 10:04:16

Windows系统修改Docker Desktop(WSL2)内存分配

# Windows查看docker信息 docker info 新增wsl全局配置文件(.wslconfig文件)：windows路径栏输入：%UserProfile%，找到目录C:\Users\Administrator，默认是没有这个配置文件的，可以自己新增 # 设置在wsl2上运行 [wsl2] # …...

编程日记 2025/8/17 8:54:53

Oracle02-安装

零、文章目录 Oracle02-安装 1、Windows Server2022安装Oracle11g （1）下载百度网盘地址： https://pan.baidu.com/s/15MBkMt1ldbSFm4L74h7Myg?pwd8888下载完成两个压缩包解压放在一起 （2）安装双击 setup 文件安…...

编程日记 2025/8/17 13:24:30

Linux[Makefile]

Makefile基础结构规则语法 target: prerequisitescommandtarget：生成的目标（如可执行文件、.o文件） prerequisites：依赖项（源码、头文件等） command：构建命令（必须用Tab缩进&am…...

编程日记 2025/8/17 8:28:32

相同的数（简单）

深度优先搜索如果两个二叉树都为空，则两个二叉树相同。如果两个二叉树中有且只有一个为空，则两个二叉树一定不相同。如果两个二叉树都不为空，那么首先判断它们的根节点的值是否相同，若不相同则两个二叉树一定不同，…...

编程日记 2025/8/17 8:28:51

「Mac畅玩AIGC与多模态22」开发篇18 - 多段输出拼接与格式化展现工作流示例

一、概述本篇以已有多字段输出为基础，介绍如何通过执行 LLM 节点对多个上游字段进行统一拼接与格式化处理。开发人员将学习如何从多个节点输出中提取数据字段，并组合为结构清晰、风格统一的最终输出，提升用户阅读体验。二、环境准备 mac…...

编程日记 2025/8/17 10:40:51

餐饮部绩效考核管理制度与综合评估方法

在竞争激烈的餐饮行业中，标准化与数据驱动的管理手段正成为提升服务质量与运营效率的关键。绩效考核不仅关乎员工奖惩，更直接影响顾客体验、成本控制与营收水平。构建一套科学有效的绩效体系，是餐饮部精细化运营的起点。本文围绕餐饮部绩效…...

编程日记 2025/8/17 9:31:36

conda虚拟环境相关操作

查看当前存在哪些虚拟环境 conda env list conda info --env创建虚拟环境conda create -n env_name pythonX.X删除虚拟环境conda remove -n env_name --all查看安装了哪些包conda list下载/删除环境中的某个包conda install package_nameconda uninstall package_name删除所有未…...

编程日记 2025/8/18 7:37:30

达梦DM数据库安装步骤

文章目录 1、下载并解压缩2、安装DM数据库2.1 运行安装程序2.2 选择语言与时区2.3 安装向导2.4 许可证协议2.5 Key文件2.6 选择组件2.7 安装位置2.8 安装前小结2.9 安装过程2.10 已完成2.11 初始化 3、配置实例3.1选择操作方式3.2创建数据库模版3.3指定数据库目录3.4数据库标识…...

编程日记 2025/8/17 9:38:04

vue3在使用@import “./index.scss“报错

Deprecation Warning: Sass import rules are deprecated and will be removed in Dart Sass 3.0.0. More info and automated migrator: https://sass-lang.com/d/import 2 │ import "./index.scss"; 在 Sass 3.0.0.之后导入样式使用 “use” ，不在使…...

编程日记 2025/8/17 10:19:35

对标研华ECU-461，搭载飞腾4核/8核国产处理器, 提供8网 8串B码对时双显无风扇的ARM通信管理平台

飞腾 FT-2000/4 和 D2000/8 主控制器，主频 2.3~2.6GHz 8 个千兆网口 , 8 个全功能隔离串口 HDMIVGA 双显示接口 3 个 USB2.0, 2 个 USB3.0 支持 2 组 SATA 硬盘存储支持 CAN 通讯 ( 替换 4 路或 8 路 COM) 整机无风扇散热设计 …...

编程日记 2025/8/17 8:28:06

如何将C#程序打包成软件绿色包

文章目录前言步骤如下：总结前言在实际工作中，很多时候会开发一些特别小的工具，当这些工具需要发给别人用时，不值当的打个安装包，最适合做一个绿色包，别人拿到后，直接双击exe就可以用。步骤…...

编程日记 2025/8/17 9:24:51

实验三数据查询

一、【实验教学 1、掌握单表查询。 2、掌握多表查询。二、【实验教学的基本要求】 1、掌握SQL程序设计基本规范； 2、熟练运用SQL实现数据基本查询，包括单表查询、分组统计查询和连接查询； 3、理解和掌握SQL查询语句中各个子句的特点和…...

编程日记 2025/8/17 9:41:45

关于串口读写NAND闪存的用法

在嵌入式系统中，nand 命令通常用于操作和管理 NAND 闪存子系统，特别是在引导加载程序（如 U-Boot）中。NAND 闪存是一种非易失性存储设备，广泛用于嵌入式设备中，用于存储操作系统、应用程序、配置文件等数据。…...

编程日记 2025/8/17 8:31:23

C++：实现线程池

线程池（Thread Pool）是一种多线程处理方式，用于管理和复用多个线程，以提高程序的并发性能并避免频繁创建和销毁线程所带来的开销。基本概念： 线程池维护着若干个已创建好的线程，当有任务需要执行时&…...

编程日记 2025/8/18 14:09:09

本地运行qwen3:30b-a3b速度测试

仍然使用的是ollama，运行的Q4_K_M量化版。这个模型在相同硬件环境下对比我电脑上其他32b的模型速度（小于3 tokens/s）提升非常明显，并且可以设置是否打开思考模式。注意： /no_think前有个空格非思考模式&#xff1…...

编程日记 2025/8/17 10:30:14

keil+vscode+腾讯ai助手

嵌入式软件开发这个是之前一直想写的开发方式，不过上份工作一直在忙，没有抽出时间花在上面，现在空下来好好写一写吧！标题软件安装关于VSCode以及Keil的安装可以在以下链接中点击浏览 VSCode安装 Keil5安装 CubeMx安装插件下…...

编程日记 2025/8/17 10:34:45

通过TinyML为语音助手赋能，推动以用户为中心的创新和现实世界应用

英文标题：Empowering voice assistants with TinyML for user-centric innovations and real-world applications 中文标题：通过TinyML为语音助手赋能，推动以用户为中心的创新和现实世界应用作者信息 Sireesha Chittepu1, Sheshikala Mart…...

编程日记 2025/8/17 9:38:12

学习Python网络爬虫的实例

30岁程序员学习Python的第二天之网络爬虫的练习实例爬取软科2025年中国大学排名思路： 1、百度查到到网页地址：https://www.shanghairanking.cn/rankings/bcur/2025 2、编写爬取代码，具体步骤分3步，第一步通过requests库爬取网…...

编程日记 2025/8/17 8:29:20

雨云游戏云MCSM面板服使用教程我的世界Forge服务端开服教程

雨云 - 新一代云服务提供商雨云面板服目前支持一键开服的游戏有：Minecraft Java版、Minecraft 基岩版、泰拉瑞亚、饥荒，还提供纯Java/Linux环境（Docker），方便开自己开其他游戏服。其中Minecraft Java版支持一键开…...

编程日记 2025/8/17 10:04:44

关于loadstartcode使用

loadstartcode 命令用于从 TFTP 服务器下载一个名为 startcode 的文件。这个命令通常用于将启动代码（如引导加载程序或内核启动映像）从 TFTP 服务器加载到设备内存中。它是嵌入式设备和网络设备（如路由器）常见的命令，通…...

编程日记 2025/8/17 10:24:25

Linux死锁实验分析与总结

三、实验结果截图及分析 1. 实验代码 #include <pthread.h> #include <stdio.h> #include <unistd.h>pthread_mutex_t mutex1 PTHREAD_MUTEX_INITIALIZER; pthread_mutex_t mutex2 PTHREAD_MUTEX_INITIALIZER;void* producer(void* arg) {while (1) {pth…...

编程日记 2025/8/17 8:27:22

【计网】ipconfig、ping、arp、tracert

目录 ipconfig ping arp tracert cmd ipconfig ipcofig -all IPv4 物理地址 ping 检测网络连通情况，分析网络速度根据域名得到服务器IP 根据TTL判断对方所使用的操作系统以及数据包经过路由器数量 byte数据包大小 time响应时间 TTLDNS记录在DNS服务器上存在…...

编程日记 2025/8/17 8:27:43

当手机开始预判你的下一步：一场正在颠覆生活的AI静默革命

当手机开始预判你的下一步：一场正在颠覆生活的AI静默革命深夜加班时，手机自动调暗屏幕亮度；出差途中，智能音箱提前预定好常去的酒店；打开购物APP，推荐清单里躺着昨天刚在聊天中提到的商品——这些场景背后…...

编程日记 2025/8/17 8:28:59

【SDRS】面向多模态情感分析的情感感知解纠缠表征转移

abstract 多模态情感分析（MSA）旨在利用多模态的互补信息对用户生成的视频进行情感理解。现有的方法主要集中在设计复杂的特征融合策略来整合单独提取的多模态表示，忽略了与情感无关的信息的干扰。在本文中，我们提出将单模表征分解为情感特定特征和情感独立特征，并将前者融…...

编程日记 2025/8/18 10:16:32

C++ 中的静态链接和动态链接详解

目录一、什么是链接？ 链接分为两类： 二、静态链接（Static Linking） 特点： 优点： 缺点： 使用方式： 三、动态链接（Dynamic Linking） 特点： 优…...

编程日记 2025/8/17 8:27:36

426、N叉树的层序遍历

输入检查： if not root:return [] 如果根节点为空，直接返回空列表初始化： result [] queue collections.deque([root]) result用于存储最终结果queue初始化包含根节点，使用双端队列实现主循环： while queue:leve…...

编程日记 2025/8/18 14:21:49

雅思阅读--重点短语/句式39个

文章目录 1. according to2. regardless of3. make/keep/leave + n. + adj.leave us stronger1. according to “according to（根据）”。德国著名数学家 David Hilbert（大卫希尔伯特）说过： Mathematics is a game played according to certain simple rules with meanin…...

编程日记 2025/8/17 9:51:11

探索开源大模型体系：当今AI的引领者

目录 1. Hugging Face Transformers 2. OpenAI GPT 3. DeepSpeed 4. Megatron-LM 5. AllenNLP 总结在当今人工智能的迅猛发展中，大模型（Large Model）已经成为了AI领域的核心。与传统的机器学习模型相比，大模型在自然语言处…...

编程日记 2025/8/17 8:37:14

n8n系列（1）初识n8n：工作流自动化平台概述

1. 引言随着各类自动化工具的涌现，n8n作为一款开源的工作流自动化平台，凭借其灵活性、可扩展性和强大的集成能力，正在获得越来越多技术团队的青睐。本文作为n8n系列的开篇，将带您全面了解这个强大的自动化平台，探索其起源、特性以及与其他工具的差异，帮助您判断n8n是否…...

编程日记 2025/8/18 13:27:07

(4) 组件传递Props效验

相关文章：