Flow All In One
Flow All In One
Flow is a static type checker for JavaScript
https://github.com/facebook/flow
https://flow.org/en/docs/install/
$ yarn add --dev @babel/core @babel/cli @babel/preset-flow
//.babelrc
{
"presets": ["@babel/preset-flow"]
}
$ yarn run babel src/ -d lib/
// package.json
{
"name": "my-project",
"main": "lib/index.js",
"scripts": {
"build": "babel src/ -d lib/",
"prepublish": "yarn run build"
}
}
# local project
$ yarn add --dev flow-bin
# init
$ yarn run flow init
$ yarn run flow
https://flow.org/en/docs/usage/
// @flow
/* @flow */
React Components
https://flow.org/en/docs/react/components/
import React from 'react';
import PropTypes from 'prop-types';
class MyComponent extends React.Component {
static propTypes = {
foo: PropTypes.number.isRequired,
bar: PropTypes.string,
};
render() {
return <div>{this.props.bar}</div>;
}
}
import * as React from 'react';
type Props = {
foo: number,
bar?: string,
};
class MyComponent extends React.Component<Props> {
render() {
this.props.doesNotExist; // Error! You did not define a `doesNotExist` prop.
return <div>{this.props.bar}</div>;
}
}
<MyComponent foo={42} />;
FlowType
https://flow.org/en/docs/react/types/
https://www.saltycrane.com/cheat-sheets/flow-type/v0.55.0/
https://www.saltycrane.com/cheat-sheets/flow-type/latest/
PureComponent
// import React, {
// // useState,
// // useEffect,
// // Component,
// PureComponent,
// } from "react";
// import { FlowFlags } from "typescript";
// FlowFlags
// import "./style.css";
import * as React from 'react';
// pcsf, PureComponent Class FlowType
type P = {
str: string,
};
type S = {
int: number,
};
class PCSFApp extends PureComponent<P, S> {
state = { }
render() {
return (
<>
<p>pcsf, PureComponent Class FlowType</p>
</>
);
}
}
export default PCSFApp;
refs
xgqfrms 2012-2020
www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!
Flow All In One的更多相关文章
- Git 在团队中的最佳实践--如何正确使用Git Flow
我们已经从SVN 切换到Git很多年了,现在几乎所有的项目都在使用Github管理, 本篇文章讲一下为什么使用Git, 以及如何在团队中正确使用. Git的优点 Git的优点很多,但是这里只列出我认为 ...
- [LeetCode] Pacific Atlantic Water Flow 太平洋大西洋水流
Given an m x n matrix of non-negative integers representing the height of each unit cell in a contin ...
- BZOJ 4390: [Usaco2015 dec]Max Flow
4390: [Usaco2015 dec]Max Flow Time Limit: 10 Sec Memory Limit: 128 MBSubmit: 177 Solved: 113[Submi ...
- ArcGIS制作放射状流向地图(Radial Flow Map)
流向地图火了,因为Facebook的那张著名的友邻图,抑或因为<数据可视化之美>中介绍飞行模式的航线图,总之,流向地图以它特殊的可视化形式,直观地展示事物之间的联系,尤其在展示网络流向.贸 ...
- SSIS Data Flow优化
一,数据流设计优化 数据流有两个特性:流和在内存缓冲区中处理数据,根据数据流的这两个特性,对数据流进行优化. 1,流,同时对数据进行提取,转换和加载操作 流,就是在source提取数据时,转换组件处理 ...
- Data Flow的Error Output
一,在Data Flow Task中,对于Error Row的处理通过Error Output Tab配置的. 1,操作失败的类型:Error(Conversion) 和 Truncation. 2, ...
- SSIS Data Flow 的 Execution Tree 和 Data Pipeline
一,Execution Tree 执行树是数据流组件(转换和适配器)基于同步关系所建立的逻辑分组,每一个分组都是一个执行树的开始和结束,也可以将执行树理解为一个缓冲区的开始和结束,即缓冲区的整个生命周 ...
- SSIS的 Data Flow 和 Control Flow
Control Flow 和 Data Flow,是SSIS Design中主要用到的两个Tab,理解这两个Tab的作用,对设计更高效的package十分重要. 一,Control Flow 在Con ...
- 前端必须了解的布局常识:普通流(normal flow)
目录 一.概述 二.块级元素和内联元素 常见的块级元素 BFC 常见的行内元素 IFC 三.哪些情况会脱离普通流 浮动 绝对定位 固定定位 display:none 四.总结 五.参考资料 一.概述 ...
- 财务报表 > 现金流表的直接法,间接法,Cash Flow from Operating Activites
经营活动现金流量 Cash Flow from Operating Activites 是指企业投资活动和筹资活动以外的所有的交易和事项产生的现金流量.它是企业现金的主要来源. 1. 直接法经营活动现 ...
随机推荐
- QUIC协议分析-基于quic-go
quic协议分析 QUIC是由谷歌设计的一种基于UDP的传输层网络协议,并且已经成为IETF草案.HTTP/3就是基于QUIC协议的.QUIC只是一个协议,可以通过多种方法来实现,目前常见的实现有Go ...
- (07)-Python3之--函数
1.定义 函数:实现了某一特定功能. 可以重复使用. 例如: len() 功能:获取长度.input() 功能: 控制台输入print() 功能:输出 语法: def 函数名称(参数 ...
- 支持 gRPC 长链接,深度解读 Nacos 2.0 架构设计及新模型
支持 gRPC 长链接,深度解读 Nacos 2.0 架构设计及新模型 原创 杨翊(席翁) 阿里巴巴云原生 2020-12-28
- By default, the connection will be closed if the proxied server does not transmit any data within 60 seconds.
WebSocket proxying https://nginx.org/en/docs/http/websocket.html By default, the connection will be ...
- .NET5 它来了!微软大一统时代来临!
今天双11,Microsoft released.NET 5(在他们的开发博客上同时发布).新版本的重点是改进.NET Core 3.1: 更小的单文件应用程序.对 Windows ARM64的支持以 ...
- MSSQL 注入笔记
前置知识: 登录名:登录sql server服务器的用户,而不是操作"数据库用户名". 固定服务器角色:就是上面登录名所属的权限组.其中重要的就是"sysadmin&qu ...
- (十四)整合 ClickHouse数据库,实现数据高性能查询分析
整合 ClickHouse数据库,实现数据高性能查询分析 1.ClickHouse简介 1.1 数据分析能力 2.SpringBoot整个ClickHouse 2.1 核心依赖 2.2 配属数据源 2 ...
- login shell 和 non-login shell 的相关问题
问题:通过su命令切换用户并没有进入该用户的shell环境.这是为什么? 要解决这个问题,我们必须清楚用login shell 和non-login shell的区别. login sh ...
- 1.DHCP的定义
1.Dynamic Host Configuration Protocol (DHCP)是一种客户端/服务器协议,可自动向Internet协议(IP)主机提供其IP地址和其他相关配置信息,例如子网掩码 ...
- 如何用RabbitMQ实现延迟队列
前言 在 jdk 的 juc 工具包中,提供了一种延迟队列 DelayQueue.延迟队列用处非常广泛,比如我们最常见的场景就是在网购或者外卖平台中发起一个订单,如果不付款,一般 15 分钟后就会被关 ...