React类型检查

类型检查

import PropTypes from ‘prop-types‘

类名==List
List.propTypes = {
    list: PropTypes.array
}

// 默认值
List.defaultProps = {
    list:[]
}

props:

1.只读不能修改(不能再赋值表达式左边)
    2.ComponentWillReceiveProp()
    3.propTypes
    4. defaultProps
    5.children

web > native

native 需要下载安装包
// react-router-dom

web  直接有的
//react-router-native

nvm

命令 说明
nvm list available 查看所有版本
nvm install 版本号 下载
nvm list 列出当前可用的包
nvm use 版本号 使用哪一个包
history 历史

路由模式

Vue使用hash模式
React 使用两种模式

HashRouter
# 哈希模式(HashRouter)  锚点 

浏览器端忽略#(无法把#及之后带过去)

browserRouter
    路由localhost地址
    访问地址不存在,进行重定向

Node起服务

路由

1.下载 react-router-dom

2.
import {
    HashRouter as Router,
    Link,
    Route,
    Switch
} from ‘ react-router-dom‘

3.<Router></Router>

<Switch>

    //当route不给path属性时会匹配任意路由
    <Router component={()=><h1>未匹配的路由</h1>}></Router> 无path匹配任何路由

    当redirect不给from属性时也会匹配任意路由
    <Redirect exact from=‘/‘ to=‘/index‘></Redirect>
</Switch>

Link, //导航标签 to属性声明要跳转的路径
Route,//占位标签,如果path与当前路径一模一样时才匹配
Switch // 返回匹配的第一个路由
exact 表示精准匹配,当path与当前路径一模一样时才匹配

传参

1.地址栏传参
‘/index/:id?‘ 传递变量
‘/index/10‘ 传递常量
‘/index?a=1&b=2‘ 直接传递数据

Link 标签的to属性
    to={{
        pathname:‘/cart‘,
        data:{a:1,b:2}
    }}
// 在location接收

回退版本

window.history.go(-1)

window.history.back()

透传

a => b => c
b只能接收a的值不能修改a的值

replace

有两种常见的渲染组件的方式:

component和render。前者是使用React.createElement方法新建一个元素,而后者仅仅是调用现有组件的render方法

原文地址:https://www.cnblogs.com/2oex/p/9569179.html

时间: 2024-08-01 00:22:01

React类型检查的相关文章

react的类型检查PropTypes自React v15.5起已弃用,请使用prop-types

最近使用React的类型检查PropTypes时,遇到错误:TypeError: Cannot read property 'array' of undefined 看了下自己的React版本:    "react": "^16.2.0",google搜了下,原来:react的类型检查PropTypes自React v15.5起已弃用,请使用prop-types使用方法参考: https://doc.react-china.org/docs/typechecking

React 使用 PropTypes 进行类型检查

注意: React.PropTypes 自 React v15.5 起已弃用.请使用 prop-types 库代替. defaultProps 用来确保 this.props.name 在父组件没有特别指定的情况下,有一个初始值.类型检查发生在 defaultProps 赋值之后,所以类型检查也会应用在 defaultProps 上面. 出处:https://react.bootcss.com/react/docs/typechecking-with-proptypes.html 原文地址:ht

javascript函数参数、返回值类型检查

实现带参数.返回值类型声明的js函数: 类型定义:window.Str = Type.Str = Type.define('STRING', Type.isStr);var Per = Type.define('PERSON', function(p){    return p && p.type === 'person' && p.name;}); 定义函数:var addStr = Str(function(a, b){  return a + b;}, Str, St

Java中静态类型检查是如何进行的

以下内容来自维基百科,关于静态类型检查和动态类型检查的解释: 静态类型检查:基于程序的源代码来验证类型安全的过程: 动态类型检查:在程序运行期间验证类型安全的过程: Java使用静态类型检查在编译期间分析程序,确保没有类型错误.基本的思想是不要让类型错误在运行期间发生. 以下代码是一个例子,理解了他,你会更好的理解Java静态类型检查是如何工作的. 代码示例 假定我们有如下类,A和B,B继承A. class A { A me() { return this; } public void doA(

关于C++类型检查的一点小挫折

 问题: 定义了一个float型数组Lut[],我让一个整型指针指向数组名int * Address=lut ; VS2008报错: error C2440: '=' : cannot convert from 'float [256]' to 'int * ' 疑问:貌似在我C语言中,不止一次听过数组名代表数组的首地址:为啥在C++面前就不好使了(PS C++严格类型检查or类型匹配): 详细解答时间查查资料便晓得喽!不能不说C++的严谨性:近期查到Reason后,会记录在此!

JAVA 7新特性——在单个catch代码块中捕获多个异常,以及用升级版的类型检查重新抛出异常

在Java 7中,catch代码块得到了升级,用以在单个catch块中处理多个异常.如果你要捕获多个异常并且它们包含相似的代码,使用这一特性将会减少代码重复度.下面用一个例子来理解. Java 7之前的版本: 1 2 3 4 5 6 7 8 9 10 catch (IOException ex) {      logger.error(ex);      throw new MyException(ex.getMessage()); catch (SQLException ex) {      

Swift类型检查与转换

继承会发生在子类和父类中,如图所示,是一系列类的继承关系类图,Person是类层次结构中的根类,Student是Person的直接子类,Worker是Person的直接子类.这个继承关系类图的具体实现代码如下: class Person { var name : String var age : Int func description() -> String { return "\(name) 年龄是: \(age)" } convenience init () { self.

O-C相关-10-动态类型检查

10-动态类型检查 1.动态绑定 1)OC 中方法的调用不由编译器决定,而由运行时决定 2)OC 中没有方法调用,只有消息接收. 一般称消息为选择器 2.动态类型检查 对象在运行时获得类型的能力称为内省,如果在代码中想知道对象是否具有指定方法,可以使用: 1)判断类型或父类类型 -(BOOL)isKindOfClass:(Class)Obj 判断一个对象是不是有某个类或其子类实例化出来的对象 2)仅判断类型 -(BOOL)isMemberOfClass:(Class)obj 判断对象是不是被某个

神奇的描述符(二):使用描述符实现实例属性的类型检查

因为描述符本身可以接管实例属性的访问,利用这个特点,可以使用描述符来实现一些实例属性的类型检查工作. 先定义一个描述符 Point,用于管理坐标信息. class Point: def __init__(self, name): self.name = name def __get__(self, instance, owner): # 通常情况下,通过类属性访问描述符时,返回描述符自身 if instance is None: return self # 通过实例属性访问描述符时,返回实例 e