Socket
Socket
Sign inDemoInstall

dfws-admin-tabs

Package Overview
Dependencies
129
Maintainers
1
Versions
6
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

    dfws-admin-tabs

东方网升 Ant Design 版Tabs组件, 适配admin-portal v2.x


Version published
Weekly downloads
1
decreased by-87.5%
Maintainers
1
Created
Weekly downloads
 

Readme

Source

东方网升Ant Design版选择器组件。

使用之前

该组件依赖于Ant Design组件,使用之前请配置Ant Design。

何时使用

  • 弹出一个下拉菜单给用户选择操作,用于代替原生的选择器,或者需要一个更优雅的多选器时。
  • 当选项少时(少于 5 项),建议直接将选项平铺,使用 Radio 是更好的选择。

API

<DfwsSelect code="major">
</DfwsSelect>

DfwsSelect props

参数说明类型默认值
code字典codestring-
url字典服务URLstring-
allowClear支持清除booleanfalse
autoFocus默认获取焦点booleanfalse
combobox输入框自动提示模式(2.9 之后废弃,请使用 modebooleanfalse
defaultActiveFirstOption是否默认高亮第一个选项。booleantrue
defaultValue指定默认选中的条目string|string[]|number|number[]-
disabled是否禁用booleanfalse
dropdownClassName下拉菜单的 className 属性string-
dropdownMatchSelectWidth下拉菜单和选择器同宽booleantrue
dropdownStyle下拉菜单的 style 属性object-
filterOption是否根据输入项进行筛选。当其为一个函数时,会接收 inputValue option 两个参数,当 option 符合筛选条件时,应返回 true,反之则返回 falseboolean or function(inputValue, option)true
firstActiveValue默认高亮的选项string|string[]-
getPopupContainer菜单渲染父节点。默认渲染到 body 上,如果你遇到菜单滚动定位问题,试试修改为滚动的区域,并相对其定位。示例Function(triggerNode)() => document.body
labelInValue是否把每个选项的 label 包装到 value 中,会把 Select 的 value 类型从 string 变为 {key: string, label: ReactNode} 的格式booleanfalse
maxTagCount最多显示多少个 tagnumber-
maxTagPlaceholder隐藏 tag 时显示的内容ReactNode/function(omittedValues)-
mode设置 Select 的模式(2.9 之后支持)'multiple' | 'tags' | 'combobox'-
multiple支持多选(2.9 之后废弃,请使用 modebooleanfalse
notFoundContent当下拉列表为空时显示的内容string'Not Found'
optionFilterProp搜索时过滤对应的 option 属性,如设置为 children 表示对内嵌内容进行搜索stringvalue
optionLabelProp回填到选择框的 Option 的属性值,默认是 Option 的子元素。比如在子元素需要高亮效果时,此值可以设为 valuestringchildren (combobox 模式下为 value
placeholder选择框默认文字string-
showSearch使单选模式可搜索booleanfalse
showArrow是否显示下拉小箭头booleantrue
size选择框大小,可选 large smallstringdefault
tags可以把随意输入的条目作为 tag,输入项不需要与下拉选项匹配(2.9 之后废弃,请使用 modebooleanfalse
tokenSeparators在 tags 和 multiple 模式下自动分词的分隔符string[]
value指定当前选中的条目string|string[]|number|number[]-
onBlur失去焦点的时回调function-
onChange选中 option,或 input 的 value 变化(combobox 模式下)时,调用此函数function(value, option:Option/Array<Option>)-
onDeselect取消选中时调用,参数为选中项的 value (或 key) 值,仅在 multiple 或 tags 模式下生效function(value,option:Option)-
onFocus获得焦点时回调function-
onMouseEnter鼠标移入时回调function-
onMouseLeave鼠标移出时回调function-
onPopupScroll下拉列表滚动时的回调function-
onSearch文本框值变化时回调function(value: string)
onSelect被选中时调用,参数为选中项的 value (或 key) 值function(value, option:Option)-

注意,如果发现下拉菜单跟随页面滚动,或者需要在其他弹层中触发 Select,请尝试使用 getPopupContainer={triggerNode => triggerNode.parentNode} 将下拉弹层渲染节点固定在触发器的父元素中。

DfwsSelect Methods

名称说明
blur()取消焦点
focus()获取焦点

Option props

参数说明类型默认值
disabled是否禁用booleanfalse
key和 value 含义一致。如果 React 需要你设置此项,此项值与 value 的值相同,然后可以省略 value 设置string
title选中该 Option 后,Select 的 titlestring-
value默认根据此属性值进行筛选string|number-

OptGroup props

参数说明类型默认值
keystring-
label组名string|React.Element

参考

Ant Design

Keywords

FAQs

Last updated on 12 Nov 2018

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc