Gathering detailed insights and metrics for cat-react-tool
Gathering detailed insights and metrics for cat-react-tool
Gathering detailed insights and metrics for cat-react-tool
Gathering detailed insights and metrics for cat-react-tool
npm install cat-react-tool
Typescript
Module System
Node Version
NPM Version
TypeScript (88.23%)
JavaScript (9.49%)
CSS (1.57%)
HTML (0.71%)
Total Downloads
0
Last Day
0
Last Week
0
Last Month
0
Last Year
0
1 Stars
89 Commits
24 Branches
1 Contributors
Updated on Jul 11, 2019
Latest Version
0.4.0
Package Id
cat-react-tool@0.4.0
Unpacked Size
134.13 kB
Size
42.40 kB
File Count
84
NPM Version
6.2.0
Node Version
10.8.0
Cumulative downloads
Total Downloads
Last Day
0%
NaN
Compared to previous day
Last Week
0%
NaN
Compared to previous week
Last Month
0%
NaN
Compared to previous month
Last Year
0%
NaN
Compared to previous year
No dependencies detected.
Demo (组件不包括UI样式)
<Button
className={ 'my-btn br1' }
onClick={ this.onClick }
disabled={ false }
>我是一个按钮</Button>
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
disabled? | 是否禁止点击 | boolean | 无 |
onClick? | 点击触发 | () => void | 无 |
className? | 样式名 | string | 无 |
style? | style | React.CSSProperties | 无 |
type? | html的type | string | 无 |
Toast({
duration: 3000,
text: '我是一个3秒的toast',
})
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
text | 提示文字 | string | 无 |
duration? | 持续时间 | number | 3000 |
Alert({
subtitle: '我是副标题',
title: '我是一个alert',
})
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
title | 提示标题 | string | 无 |
subtitle? | 提示内容 | string | 无 |
noDefault? | 设置没有取消按钮 | boolean | false |
noPrimary? | 设置没有确定按钮 | boolean | false |
default? | 点击取消时调用 | () => void | 无 |
primary? | 点击确定时调用 | () => void | 无 |
<Loading
loading={ true }
/>
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
loading | loading状态 | boolean | false |
text? | 文字内容 | string | 加载中 |
<Image
className={ 'my-image' }
src={ 'https://img7.kcimg.cn/uploads/c7/4c/c74cd79689721906d4a5831031a5c8e4.jpg' }
alt={ '图片' }
/>
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
src | 显示图片地址 | string | 无 |
alt? | 图片文案 | string | 无 |
className? | 样式名称 | string | 无 |
defaultSrc? | 默认图片地址 | string | 无 |
onSuccess? | 成功加载的回调 | () => void | 无 |
onError? | 错误加载的回调 | (e: any) => void | 无 |
// 数据
let data = [{
value: 0,
text: '选项1',
children: [{
value: 0,
text: '选项1-1',
},{
value: 1,
text: '选项1-2',
}]
},{
value: 1,
text: '选项2',
children: [{
value: 0,
text: '选项2-1',
},{
value: 1,
text: '选项2-2',
}]
}]
<Select
data={ data }
onConfirm={ this.onConfirm }
name={ 'username' }
className={ 'my-select' }
placeholder={ '请选择名称' }
length={ 2 }
error={ '请选择名称' }
/>
// 接口
interface Value {
text: string;
value: string | number;
children?: Value[] | undefined;
}
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
data | 选择器数据 | Value[] | [] |
name | select的name属性 | string | 无 |
onChange? | 选择器改变后触发 | (item: Value[]) => void | 无 |
onConfirm? | 确认按钮触发 | (item: Value[]) => void | 无 |
placeholder? | 未选择默认文案 | string | 请选择 |
defaultValue? | 默认选项 | Value | 无 |
className? | 样式名称 | string | 无 |
length? | 选择器数量 | number | 1 |
type? | 选择器类型,可选 'date' | string | 无 |
error? | 错误提示,配合form表单使用,如果设置此项,在form中表示必填 | string | 无 |
<Input
type={ 'password' }
maxLength={ 10 }
name={ 'password' }
className={ 'my-input' }
placeholder={ '请输入密码' }
error={ '请输入密码' }
/>
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
name | input的name属性 | string | 无 |
type? | input的type属性,若设置为 textarea 则为 textarea元素,mobile 自动设置长度11位验证,调用数字键盘 | string | 无 |
maxLength? | input的maxLength属性 | number | 无 |
className? | 样式名 | string | 无 |
style? | style | React.CSSProperties | 无 |
placeholder? | 默认文案 | string | 无 |
onInput | oninput事件 | (e) => void | 无 |
onChange | onchange事件 | (e) => void | 无 |
error? | 错误提示,配合form表单使用,如果设置此项,在form中表示必填 | string | 无 |
<Form submit={ this.submit } toast={ Toast }>
<Input
type={ 'password' }
maxLength={ 10 }
name={ 'password' }
className={ 'my-input' }
placeholder={ '请输入密码' }
error={ '请输入密码' }
/>
<Date
begin={ 2008 }
end={ 2019 }
onConfirm={ this.onConfirm }
name={ 'time' }
className={ 'my-select' }
placeholder={ '请选择时间' }
error={ '请选择时间' }
/>
<Input
type={ 'textarea' }
maxLength={ 100 }
name={ 'textarea' }
className={ 'my-textarea' }
placeholder={ '请输入文字' }
error={ '请输入文字' }
/>
<Button type={ 'submit' } className={ 'my-btn br1' }>提交</Button>
</Form>
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
submit? | 提交表单 返回表单内input、select、textarea等原生html元素的json对象,例:{password: 123, textarea: 666} | (json:object) => void | 无 |
toast? | 提示器 | any | 无 |
rules? | 表单字段校验 | object | 无 |
Rem.set(750); 设置html font-size 以设计稿750为基准 1rem == 100px
Rem.get(750); 返回 以750为基准的像素值
@Mounted 装饰器,用于装饰react组件,可以防止组件卸载后调用setState 导致报错的问题
@readonly 装饰器,用于设置属性只读,不可被修改
No vulnerabilities found.
Reason
no binaries found in the repo
Reason
Found 0/30 approved changesets -- score normalized to 0
Reason
0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0
Reason
no SAST tool detected
Details
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
security policy file not detected
Details
Reason
license file not detected
Details
Reason
project is not fuzzed
Details
Reason
branch protection not enabled on development/release branches
Details
Reason
135 existing vulnerabilities detected
Details
Score
Last Scanned on 2025-07-07
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More