test/ant-design
1
0
Fork 0
mirror of https://gitee.com/ant-design/ant-design.git synced 2024-12-02 03:59:01 +08:00
Code Issues Actions 84 Packages Projects Releases Wiki Activity

correct typo: filedNames => fieldNames

Browse Source
This commit is contained in:
afc163 2018-07-03 19:54:33 +08:00 committed by 陈帅
parent 8eb8c686ce
commit db4a5edf8e
5 changed files with 28 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
components/cascader/demo/fileds-name.md
View File

@ -45,6 +45,6 @@ function onChange(value) {
} }
ReactDOM.render( ReactDOM.render(
<Cascader filedNames={{ label: 'name', value: 'code', children: 'items' }} options={options} onChange={onChange} placeholder="Please select" />, <Cascader fieldNames={{ label: 'name', value: 'code', children: 'items' }} options={options} onChange={onChange} placeholder="Please select" />,
mountNode); mountNode);
```` ````

2
components/cascader/index.en-US.md
View File

@ -28,7 +28,7 @@ Cascade selection box.
| disabled | whether disabled select | boolean | false | | disabled | whether disabled select | boolean | false |
| displayRender | render function of displaying selected options | `(label, selectedOptions) => ReactNode` | `label => label.join(' / ')` | | displayRender | render function of displaying selected options | `(label, selectedOptions) => ReactNode` | `label => label.join(' / ')` |
| expandTrigger | expand current item when click or hover, one of 'click' 'hover' | string | 'click' | | expandTrigger | expand current item when click or hover, one of 'click' 'hover' | string | 'click' |
| filedNames | custom field name for label and value and children | object | `{ label: 'label', value: 'value', children: 'children' }` | | fieldNames | custom field name for label and value and children | object | `{ label: 'label', value: 'value', children: 'children' }` |
| getPopupContainer | Parent Node which the selector should be rendered to. Default to `body`. When position issues happen, try to modify it into scrollable content and position it relative.[example](https://codepen.io/afc163/pen/zEjNOy?editors=0010) | Function(triggerNode) | () => document.body | | getPopupContainer | Parent Node which the selector should be rendered to. Default to `body`. When position issues happen, try to modify it into scrollable content and position it relative.[example](https://codepen.io/afc163/pen/zEjNOy?editors=0010) | Function(triggerNode) | () => document.body |
| loadData | To load option lazily, and it cannot work with `showSearch` | `(selectedOptions) => void` | - | | loadData | To load option lazily, and it cannot work with `showSearch` | `(selectedOptions) => void` | - |
| notFoundContent | Specify content to show when no result matches. | string | 'Not Found' | | notFoundContent | Specify content to show when no result matches. | string | 'Not Found' |

48
components/cascader/index.tsx
View File

@ -15,13 +15,13 @@ export interface CascaderOptionType {
[key: string]: any; [key: string]: any;
} }
export interface FiledNamesType { export interface FieldNamesType {
value?: string; value?: string;
label?: string; label?: string;
children?: string; children?: string;
} }
export interface FilledFiledNamesType { export interface FilledFieldNamesType {
value: string; value: string;
label: string; label: string;
children: string; children: string;
@ -30,14 +30,14 @@ export interface FilledFiledNamesType {
export type CascaderExpandTrigger = 'click' | 'hover'; export type CascaderExpandTrigger = 'click' | 'hover';
export interface ShowSearchType { export interface ShowSearchType {
filter?: (inputValue: string, path: CascaderOptionType[], names: FilledFiledNamesType) => boolean; filter?: (inputValue: string, path: CascaderOptionType[], names: FilledFieldNamesType) => boolean;
render?: ( render?: (
inputValue: string, inputValue: string,
path: CascaderOptionType[], path: CascaderOptionType[],
prefixCls: string | undefined, prefixCls: string | undefined,
names: FilledFiledNamesType, names: FilledFieldNamesType,
) => React.ReactNode; ) => React.ReactNode;
sort?: (a: CascaderOptionType[], b: CascaderOptionType[], inputValue: string, names: FilledFiledNamesType) => number; sort?: (a: CascaderOptionType[], b: CascaderOptionType[], inputValue: string, names: FilledFieldNamesType) => number;
matchInputWidth?: boolean; matchInputWidth?: boolean;
} }
@ -81,7 +81,7 @@ export interface CascaderProps {
inputPrefixCls?: string; inputPrefixCls?: string;
getPopupContainer?: (triggerNode?: HTMLElement) => HTMLElement; getPopupContainer?: (triggerNode?: HTMLElement) => HTMLElement;
popupVisible?: boolean; popupVisible?: boolean;
filedNames?: FiledNamesType; fieldNames?: FieldNamesType;
} }
export interface CascaderState { export interface CascaderState {
@ -100,7 +100,7 @@ function highlightKeyword(str: string, keyword: string, prefixCls: string | unde
]); ]);
} }
function defaultFilterOption(inputValue: string, path: CascaderOptionType[], names: FilledFiledNamesType) { function defaultFilterOption(inputValue: string, path: CascaderOptionType[], names: FilledFieldNamesType) {
return path.some(option => (option[names.label] as string).indexOf(inputValue) > -1); return path.some(option => (option[names.label] as string).indexOf(inputValue) > -1);
} }
@ -108,7 +108,7 @@ function defaultRenderFilteredOption(
inputValue: string, inputValue: string,
path: CascaderOptionType[], path: CascaderOptionType[],
prefixCls: string | undefined, prefixCls: string | undefined,
names: FilledFiledNamesType, names: FilledFieldNamesType,
) { ) {
return path.map((option, index) => { return path.map((option, index) => {
const label = option[names.label]; const label = option[names.label];
@ -119,7 +119,7 @@ function defaultRenderFilteredOption(
} }
function defaultSortFilteredOption( function defaultSortFilteredOption(
a: CascaderOptionType[], b: CascaderOptionType[], inputValue: string, names: FilledFiledNamesType, a: CascaderOptionType[], b: CascaderOptionType[], inputValue: string, names: FilledFieldNamesType,
) { ) {
function callback(elem: CascaderOptionType) { function callback(elem: CascaderOptionType) {
return (elem[names.label] as string).indexOf(inputValue) > -1; return (elem[names.label] as string).indexOf(inputValue) > -1;
@ -128,11 +128,11 @@ function defaultSortFilteredOption(
return a.findIndex(callback) - b.findIndex(callback); return a.findIndex(callback) - b.findIndex(callback);
} }
function getFilledFieldNames(filedNames: FiledNamesType = {}) { function getFilledFieldNames(fieldNames: FieldNamesType = {}) {
const names: FilledFiledNamesType = { const names: FilledFieldNamesType = {
children: filedNames.children || 'children', children: fieldNames.children || 'children',
label: filedNames.label || 'label', label: fieldNames.label || 'label',
value: filedNames.value || 'value', value: fieldNames.value || 'value',
}; };
return names; return names;
} }
@ -164,7 +164,7 @@ export default class Cascader extends React.Component<CascaderProps, CascaderSta
inputFocused: false, inputFocused: false,
popupVisible: props.popupVisible, popupVisible: props.popupVisible,
flattenOptions: flattenOptions:
props.showSearch ? this.flattenTree(props.options, props.changeOnSelect, props.filedNames) : undefined, props.showSearch ? this.flattenTree(props.options, props.changeOnSelect, props.fieldNames) : undefined,
}; };
} }
@ -177,7 +177,7 @@ export default class Cascader extends React.Component<CascaderProps, CascaderSta
} }
if (nextProps.showSearch && this.props.options !== nextProps.options) { if (nextProps.showSearch && this.props.options !== nextProps.options) {
this.setState({ this.setState({
flattenOptions: this.flattenTree(nextProps.options, nextProps.changeOnSelect, nextProps.filedNames), flattenOptions: this.flattenTree(nextProps.options, nextProps.changeOnSelect, nextProps.fieldNames),
}); });
} }
} }
@ -247,8 +247,8 @@ export default class Cascader extends React.Component<CascaderProps, CascaderSta
} }
getLabel() { getLabel() {
const { options, displayRender = defaultDisplayRender as Function, filedNames } = this.props; const { options, displayRender = defaultDisplayRender as Function, fieldNames } = this.props;
const names = getFilledFieldNames(filedNames); const names = getFilledFieldNames(fieldNames);
const value = this.state.value; const value = this.state.value;
const unwrappedValue = Array.isArray(value[0]) ? value[0] : value; const unwrappedValue = Array.isArray(value[0]) ? value[0] : value;
const selectedOptions: CascaderOptionType[] = arrayTreeFilter(options, const selectedOptions: CascaderOptionType[] = arrayTreeFilter(options,
@ -272,10 +272,10 @@ export default class Cascader extends React.Component<CascaderProps, CascaderSta
flattenTree( flattenTree(
options: CascaderOptionType[], options: CascaderOptionType[],
changeOnSelect: boolean | undefined, changeOnSelect: boolean | undefined,
filedNames: FiledNamesType | undefined, fieldNames: FieldNamesType | undefined,
ancestor: CascaderOptionType[] = [], ancestor: CascaderOptionType[] = [],
) { ) {
const names: FilledFiledNamesType = getFilledFieldNames(filedNames); const names: FilledFieldNamesType = getFilledFieldNames(fieldNames);
let flattenOptions = [] as CascaderOptionType[][]; let flattenOptions = [] as CascaderOptionType[][];
let childrenName = names.children; let childrenName = names.children;
options.forEach((option) => { options.forEach((option) => {
@ -288,7 +288,7 @@ export default class Cascader extends React.Component<CascaderProps, CascaderSta
this.flattenTree( this.flattenTree(
option[childrenName], option[childrenName],
changeOnSelect, changeOnSelect,
filedNames, fieldNames,
path, path,
), ),
); );
@ -298,8 +298,8 @@ export default class Cascader extends React.Component<CascaderProps, CascaderSta
} }
generateFilteredOptions(prefixCls: string | undefined) { generateFilteredOptions(prefixCls: string | undefined) {
const { showSearch, notFoundContent, filedNames } = this.props; const { showSearch, notFoundContent, fieldNames } = this.props;
const names: FilledFiledNamesType = getFilledFieldNames(filedNames); const names: FilledFieldNamesType = getFilledFieldNames(fieldNames);
const { const {
filter = defaultFilterOption, filter = defaultFilterOption,
render = defaultRenderFilteredOption, render = defaultRenderFilteredOption,
@ -386,7 +386,7 @@ export default class Cascader extends React.Component<CascaderProps, CascaderSta
'renderFilteredOption', 'renderFilteredOption',
'sortFilteredOption', 'sortFilteredOption',
'notFoundContent', 'notFoundContent',
'filedNames', 'fieldNames',
]); ]);
let options = props.options; let options = props.options;

2
components/cascader/index.zh-CN.md
View File

@ -29,7 +29,7 @@ subtitle: 级联选择
| disabled | 禁用 | boolean | false | | disabled | 禁用 | boolean | false |
| displayRender | 选择后展示的渲染函数 | `(label, selectedOptions) => ReactNode` | `label => label.join(' / ')` | | displayRender | 选择后展示的渲染函数 | `(label, selectedOptions) => ReactNode` | `label => label.join(' / ')` |
| expandTrigger | 次级菜单的展开方式，可选 'click' 和 'hover' | string | 'click' | | expandTrigger | 次级菜单的展开方式，可选 'click' 和 'hover' | string | 'click' |
| filedNames | 自定义 options 中 label name children 的字段 | object | `{ label: 'label', value: 'value', children: 'children' }` | | fieldNames | 自定义 options 中 label name children 的字段 | object | `{ label: 'label', value: 'value', children: 'children' }` |
| getPopupContainer | 菜单渲染父节点。默认渲染到 body 上，如果你遇到菜单滚动定位问题，试试修改为滚动的区域，并相对其定位。[示例](https://codepen.io/afc163/pen/zEjNOy?editors=0010) | Function(triggerNode) | () => document.body | | getPopupContainer | 菜单渲染父节点。默认渲染到 body 上，如果你遇到菜单滚动定位问题，试试修改为滚动的区域，并相对其定位。[示例](https://codepen.io/afc163/pen/zEjNOy?editors=0010) | Function(triggerNode) | () => document.body |
| loadData | 用于动态加载选项，无法与 `showSearch` 一起使用 | `(selectedOptions) => void` | - | | loadData | 用于动态加载选项，无法与 `showSearch` 一起使用 | `(selectedOptions) => void` | - |
| notFoundContent | 当下拉列表为空时显示的内容 | string | 'Not Found' | | notFoundContent | 当下拉列表为空时显示的内容 | string | 'Not Found' |

2
package.json
View File

@ -54,7 +54,7 @@
"raf": "^3.4.0", "raf": "^3.4.0",
"rc-animate": "^2.4.1", "rc-animate": "^2.4.1",
"rc-calendar": "~9.6.0", "rc-calendar": "~9.6.0",
"rc-cascader": "~0.13.0", "rc-cascader": "~0.14.0",
"rc-checkbox": "~2.1.5", "rc-checkbox": "~2.1.5",
"rc-collapse": "~1.9.0", "rc-collapse": "~1.9.0",
"rc-dialog": "~7.1.0", "rc-dialog": "~7.1.0",