1给props设置默认值

//导入react
    import React from 'react'
    import ReactDOM from 'react-dom'
    import PropTypes from 'prop-types'
    //导入组件
    // 约定1:类组件必须以大写字母开头
    // 约定2:类组件应该继承react.component父类 从中可以使用父类的方法和属性
    // 约定3:组件必须提供render方法
    // 约定4:render方法必须有返回值
     
    const App = (props) => {
        const arr = props.colors
        const lis = arr.map((item, index) => <li key={index}>{item}</li>)
        return <ul>{lis}</ul>
    }
    App.propTypes = {
        colors: PropTypes.array,
        a: PropTypes.number,
        //节点
        tag: PropTypes.element,
    }
    App.defaultProps = {
        colors: ['red', 'blue'],
    }
     
    ReactDOM.render(<App></App>, document.getElementById('root'))

好客租房57-props深入(4props的默认值)的更多相关文章

  1. JavaEE在职加薪课好客租房项目实战视频教程

    JavaEE在职加薪课好客租房项目实战视频教程课程介绍:       本课程采用SOA架构思想进行设计,基于目前主流后端技术框架SpringBoot.SpringMVC.Mybaits.Dubbo等来 ...

  2. props default 数组/对象的默认值应当由一个工厂函数返回

    export default {props: { slides:{ type:Array, default:[] } },这是我的代码 报错是Invalid default value for pro ...

  3. Invalid default value for prop "value": Props with type Object/Array must use a factory function to return the default value.(props default 数组/对象的默认值应当由一个工厂函数返回)

    Invalid default value for prop "value": Props with type Object/Array must use a factory fu ...

  4. 关于props default 数组/对象的默认值应当由一个工厂函数返回

    export default {props: { xAxisData: {   type: Array,   default: [] }, },这是我的代码 报错是Invalid default va ...

  5. Vue props中Object和Array设置默认值

    Vue中,在props中设置Object和Array的默认值 seller: { type: Object, default() { return {} } } seller: { type: Obj ...

  6. 8. react 基础 - props 默认值和类型限制 与 Props , State , render 函数 关系

    一. PropTypes 与 DefaultProps 官方文档 1. PropTypes 属性校验 引入 PropTypes import PropTypes from 'prop-types'; ...

  7. 为什么在使用get时,Properties对象总是忽略默认值?

    不应该对Properties对象调用get方法:而应该调用getProperty方法.许多人认为二者的区别是getProperty声明了返回值为String类型,而get声明的返回值类型为Object ...

  8. 封装input 逐渐,且input插件必须带有默认值。

    封装input 逐渐,且input插件必须带有默认值. 组件: <template> <div class="input-show"> <span c ...

  9. MySQL 5.6比较重要的参数,以及5.5到5.6默认值有过变化的参数

    新参数说明和设置,这里说下5.6比较重要的参数,以及5.5到5.6默认值有过变化的参数. MySQL Server参数: 1,optimizer_switch:优化器选项. Variable_name ...

随机推荐

  1. 体验js之美第八课-面向对象创建和继承终结篇

    概述 到这里我们讲说js面向对象的系列部分的最后一个课程,面向对象必须掌握两个东西一个是对象的创建一个是继承.这节课我们重点说说这两个问题最后我们说下在ES6里面面向对象怎么玩. 1对象的创建 我们第 ...

  2. 移动端的vw px rem之间换算

    一.vw px rem em是什么 1.vw:就是相对视口宽度(Viewport Width).1vw = 1% * 视口宽度.也就是说,一个视口就是100vw. 2.px:px应该是在css中使用最 ...

  3. zookeeper操作节点代码

    package cn.hbaf.zookeeper_api; import org.apache.curator.RetryPolicy; import org.apache.curator.fram ...

  4. java如何读取和遍历properties文件

    在java项目开发过程中,使用properties文件作为配置基本上是必不可少的,很多如系统配置信息,文件上传配置信息等等都是以这种方式进行保存.同时学会操作properties文件也是java基础. ...

  5. vue中对element-ui框架中el-table的列的每一项数据进行操作

    vue中使用element table,表格参数格式化formatter 后台返回对应的数字, 那肯定不能直接显示数字,这时候就要对 表格进行数据操作 如图: 代码: methods: { //状态改 ...

  6. Blazor组件自做九: 用20行代码实现文件上传,浏览目录功能 (3)

    接上篇 Blazor组件自做九: 用20行代码实现文件上传,浏览目录功能 (2) 7. 使用配置文件指定监听地址 打开 appsettings.json 文件,加入一行 "UseUrls&q ...

  7. 【论文阅读】ICLR 2022: Scene Transformer: A unified architecture for predicting future trajectories of multiple agents

    ICLR 2022: Scene Transformer: A unified architecture for predicting future trajectories of multiple ...

  8. SpringMVC-获得Restful风格的参数

    使用@PathVariable注解:接收请求路径中占位符的值 @RequestMapping("/report18/{username}") @ResponseBody publi ...

  9. Linux Red Hat 8.0虚拟机安装过程

    Linux Red Hat 8.0虚拟机安装过程 一.安装虚拟机所需要的工具: 1.VMware Workstation Pro 2.Red Hat 8.0 虚拟机镜像 3.还有一个就是VMware的 ...

  10. 安卓记账本开发学习day9之依赖导入失败

    根据上一篇文章导入依赖,在一些旧版本的AS上能正常完成,但是我下载最新的AS以后无法正常导入 同步的时候控制台报 Build file 'C:\CS\AndroidStudioProjects\tal ...