Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: add mentions component filterOption default #19241

Closed
wants to merge 2 commits into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
2 changes: 1 addition & 1 deletion components/mentions/index.en-US.md
Expand Up @@ -26,7 +26,7 @@ When need to mention someone or something.
| --- | --- | --- | --- | --- |
| autoFocus | Auto get focus when component mounted | boolean | `false` | 3.19.0 |
| defaultValue | Default value | string | - | 3.19.0 |
| filterOption | Customize filter option logic | false \| (input: string, option: OptionProps) => boolean | - | 3.19.0 |
| filterOption | Customize filter option logic | false \| (input: string, option: OptionProps) => boolean | `(input, { value }) => value.toLowerCase().indexOf(input.toLowerCase()) !== -1` | 3.19.0 |
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

这个太长了,也不是用户关心的。改成 Case Insensitive 吧

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

不区分大小写感觉令人困惑,解释不了中文和拼音之间的联动性,至少实际项目中异步返回数据来说并不是字符的 indexOf,就和 GitHub# 一样

| notFoundContent | Set mentions content when not match | ReactNode | 'Not Found' | 3.19.0 |
| placement | Set popup placement | 'top' \| 'bottom' | 'bottom' | 3.19.0 |
| prefix | Set trigger prefix keyword | string \| string[] | '@' | 3.19.0 |
Expand Down
40 changes: 19 additions & 21 deletions components/mentions/index.tsx
Expand Up @@ -48,28 +48,26 @@ class Mentions extends React.Component<MentionProps, MentionState> {

return value
.split(split)
.map(
(str = ''): MentionsEntity | null => {
let hitPrefix: string | null = null;

prefixList.some(prefixStr => {
const startStr = str.slice(0, prefixStr.length);
if (startStr === prefixStr) {
hitPrefix = prefixStr;
return true;
}
return false;
});

if (hitPrefix !== null) {
return {
prefix: hitPrefix,
value: str.slice(hitPrefix!.length),
};
.map((str = ''): MentionsEntity | null => {
let hitPrefix: string | null = null;

prefixList.some(prefixStr => {
const startStr = str.slice(0, prefixStr.length);
if (startStr === prefixStr) {
hitPrefix = prefixStr;
return true;
}
return null;
},
)
return false;
});

if (hitPrefix !== null) {
return {
prefix: hitPrefix,
value: str.slice(hitPrefix!.length),
};
}
return null;
})
.filter((entity): entity is MentionsEntity => !!entity && !!entity.value);
};

Expand Down
2 changes: 1 addition & 1 deletion components/mentions/index.zh-CN.md
Expand Up @@ -27,7 +27,7 @@ title: Mentions
| --- | --- | --- | --- | --- |
| autoFocus | 自动获得焦点 | boolean | `false` | 3.19.0 |
| defaultValue | 默认值 | string | - | 3.19.0 |
| filterOption | 自定义过滤逻辑 | false \| (input: string, option: OptionProps) => boolean | - | 3.19.0 |
| filterOption | 自定义过滤逻辑 | false \| (input: string, option: OptionProps) => boolean | `(input, { value }) => value.toLowerCase().indexOf(input.toLowerCase()) !== -1` | 3.19.0 |
| notFoundContent | 当下拉列表为空时显示的内容 | ReactNode | 'Not Found' | 3.19.0 |
| placement | 弹出层展示位置 | 'top' \| 'bottom' | 'bottom' | 3.19.0 |
| prefix | 设置触发关键字 | string \| string[] | '@' | 3.19.0 |
Expand Down