2023学年完整公开课版props

上传人：胡*** IP属地：安徽上传时间：2023-05-11 格式：PPTX 页数：11 大小：703.74KB 积分：14 举报 版权申诉

已阅读5页，还剩6页未读，继续免费阅读

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

props1、props的定义

2、props的类型

3、props的解析

4、props的应用实例

学习目标

1、了解props的概念

2、通过实例，掌握props的用法

props的定义

props是子组件访问父组件数据的唯一接口，具体是：一个组件可以直接在模板里面渲染data里面的数据（双大括号）。子组件不能直接在模板里面渲染父元素的数据；

如果子组件想要引用父元素的数据，那么就在props里面声明一个变量（比如a），这个变量就可以引用父元素的数据；在模板里渲染这个变量（前面的a），渲染出来的就是父元素里面的数据。

props的类型

props的类型：Array<string>|Object

props的解析

props可以是数组或对象，用于接收来自父组件的数据。props可以是简单的数组，或者使用对象作为替代，对象允许配置高级选项，如类型检测、自定义验证和设置默认值。

props的解析

基于对象的语法使用以下选项：1、type

可以是下列原生构造函数中的一种：String、Number、Boolean、Array、Object、Date、Function、Symbol、任何自定义构造函数、或上述内容组成的数组。会检查一个prop是否是给定的类型，否则抛出警告。Prop类型的更多信息在此。2、default：any

为该prop指定一个默认值。如果该prop没有被传入，则换做用这个值。对象或数组的默认值必须从一个工厂函数返回。

props的解析

3、required：Boolean

定义该prop是否是必填项。在非生产环境中，如果这个值为truthy且该prop没有被传入的，则一个控制台警告将会被抛出。4、validator：Function

自定义验证函数会将该prop的值作为唯一的参数代入。在非生产环下，如果该函数返回一个falsy的值(也就是验证失败)，一个控制台警告将会被抛出。

props的应用实例

人人文库> 全部分类> 教育资料 > 辅导培训

1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。