60Vue - Props(Prop 验证)

简介: 60Vue - Props(Prop 验证)

组件可以为 props 指定验证要求。如果未指定验证要求,Vue 会发出警告。当组件给其他人使用时这很有用。

prop 是一个对象而不是字符串数组时,它包含验证要求:

Vue.component('example', {
  props: {
    // 基础类型检测 (`null` 意思是任何类型都可以)
    propA: Number,
    // 多种类型
    propB: [String, Number],
    // 必传且是字符串
    propC: {
      type: String,
      required: true
    },
    // 数字,有默认值
    propD: {
      type: Number,
      default: 100
    },
    // 数组/对象的默认值应当由一个工厂函数返回
    propE: {
      type: Object,
      default: function () {
        return { message: 'hello' }
      }
    },
    // 自定义验证函数
    propF: {
      validator: function (value) {
        return value > 10
      }
    }
  }
})

type可以是下面原生构造器:

  • String
  • Number
  • Boolean
  • Function
  • Object
  • Array

type 也可以是一个自定义构造器,使用instanceof检测。

当 prop 验证失败了, Vue 将拒绝在子组件上设置此值,如果使用的是开发版本会抛出一条警告。

目录
相关文章
|
Linux 编译器 API
深度剖析Linux内核同步机制:实现高效可靠的并发编程
深度剖析Linux内核同步机制:实现高效可靠的并发编程
|
5月前
|
敏捷开发 运维 项目管理
Jira低成本国产方案大揭秘:2025年最值得选择的国产替代产品
随着企业对成本控制和数据合规性需求的提升,Jira项目管理工具的高昂费用和本土化不足问题日益凸显。本文对比分析了2025年主流国产替代方案(飞书项目、板栗看板、Ones等)的核心功能与适用场景,指出国产工具在中文化支持、私有化部署和成本效益方面的优势,并提供了从Jira平稳迁移的实施建议。数据显示,国产替代方案可降低80%成本,同时满足敏捷开发需求,特别适合预算有限且重视数据安全的中小企业。选择时需综合考量功能匹配度、团队适配性和迁移成本等因素。
379 0
|
9月前
|
Linux 数据安全/隐私保护 Windows
文件传输告别龟速!1分钟搞定Windows↔CentOS高速通道 小白也能玩转的Xftp秘籍
Xftp 是一款便捷的远程文件传输工具,与 XShell 类似,支持通过 SFTP 协议实现文件上传和下载。首先需下载安装 Xftp,并获取目标 Linux 系统(如 CentOS)的 IP 地址。打开 Xftp 后,按 `Ctrl + N` 新建会话,输入主机 IP、协议(SFTP)、用户名和密码连接服务器。
607 15
文件传输告别龟速!1分钟搞定Windows↔CentOS高速通道 小白也能玩转的Xftp秘籍
|
SQL 关系型数据库 数据库
在 Postgres 中使用子查询
【8月更文挑战第11天】
531 1
在 Postgres 中使用子查询
|
前端开发 安全 Java
如何在Java中实现高效率的文件上传和下载
如何在Java中实现高效率的文件上传和下载
|
存储 SQL 数据库
django如何连接sqlite数据库?
django如何连接sqlite数据库?
730 0
|
分布式计算 大数据 数据处理
MaxCompute操作报错合集之编写UDF(用户自定义函数)时,报错:找不到主类,是什么原因
MaxCompute是阿里云提供的大规模离线数据处理服务,用于大数据分析、挖掘和报表生成等场景。在使用MaxCompute进行数据处理时,可能会遇到各种操作报错。以下是一些常见的MaxCompute操作报错及其可能的原因与解决措施的合集。
337 1
|
安全 网络协议 网络安全
SSL(Secure Sockets Layer)是一种安全协议,用于在客户端和服务器之间建立加密的通信通道。
SSL(Secure Sockets Layer)是一种安全协议,用于在客户端和服务器之间建立加密的通信通道。
|
算法 Unix Shell
【Shell 命令集合 系统管理 】Linux 显示或设置系统时间和日期 date命令 使用指南
【Shell 命令集合 系统管理 】Linux 显示或设置系统时间和日期 date命令 使用指南
603 0