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. python学习笔记(七)——内置函数

    builtins.py模块,是python的内建模块,在运行时会自动导入该模块.在该模块中定义了很多我们常用的内置函数,比如print,input 等. 在 builtins.py 模块中给出如下注释 ...

  2. char向wchar的转换-MultiByteToWideChar

    问题产生 使用CreateFile函数,如下: CreateFile(lpcTheFile, GENERIC_READ, 0, NULL, OPEN_ALWAYS, FILE_ATTRIBUTE_NO ...

  3. 18个基于 HTML5 Canvas 开发的图表库

    如今,HTML5 可谓如众星捧月一般,受到许多业内巨头的青睐.很多Web开发者也尝试着用 HTML 5 来制作各种各样的富 Web 应用.HTML 5 规范引进了很多新特性,其中之一就是 Canvas ...

  4. 结合CSS3的布局新特征谈谈常见布局方法

    写在前面最近看到<图解CSS3>的布局部分,结合自己以前阅读过的一些布局方面的知识,这里进行一次基于CSS2.3的各种布局的方法总结. 常见的页面布局 在拿到设计稿时,作为一个前端人员,我 ...

  5. 2022DASCTF X SU 三月春季挑战赛 Calc

    查看代码 #coding=utf-8 from flask import Flask,render_template,url_for,render_template_string,redirect,r ...

  6. python根据日期判断星期几(超简洁)

    代码: from datetime import datetime def getWeek(week): print(date + "是星期" + str(week + 1)) d ...

  7. spring security简介与使用

    目录 spring security 新建一个springboot项目 添加spring security 登录 使用默认用户和随机生成的密码登录 使用yaml文件定义的用户名.密码登录 使用代码中指 ...

  8. 【职场必备】6个免费良心网站&职场办公网站(收藏血赚)

    1.随机自动生成头像的网站:https://www.tool22.com/Tools-SJTX.html2.迅捷PDF转换器:https://app.xunjiepdf.com/3.全网音乐下载:① ...

  9. Apache Doris ODBC Mysql外表在Ubuntu下使用方法及配置

    Apache Doris 社区 2022 年的总体规划,包括待开展或已开展.以及已完成但需要持续优化的功能.文档.社区建设等多方面,我们期待有更多的小伙伴参与进来讨论.同时也希望多多关注Doris,给 ...

  10. XCTF练习题---MISC---Test-flag-please-ignore

    XCTF练习题---MISC---Test-flag-please-ignore flag:flag{hello_world} 解题步骤: 1.观察题目,下载附件 2.打开文件,发现又是一个没有名字的 ...