diff --git a/components/mentions/__tests__/index.test.js b/components/mentions/__tests__/index.test.js
index 2329f46f49..a876171ba1 100644
--- a/components/mentions/__tests__/index.test.js
+++ b/components/mentions/__tests__/index.test.js
@@ -1,6 +1,7 @@
import React from 'react';
import { mount } from 'enzyme';
import Mentions from '..';
+import focusTest from '../../../tests/shared/focusTest';
const { getMentions } = Mentions;
@@ -71,6 +72,8 @@ describe('Mentions', () => {
expect(onBlur).toHaveBeenCalled();
});
+ focusTest(Mentions);
+
it('loading', () => {
const wrapper = mount();
simulateInput(wrapper, '@');
diff --git a/components/mentions/index.tsx b/components/mentions/index.tsx
index c0d78b99c3..b1bca46f53 100644
--- a/components/mentions/index.tsx
+++ b/components/mentions/index.tsx
@@ -48,26 +48,28 @@ class Mentions extends React.Component {
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;
+ .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),
+ };
}
- return false;
- });
-
- if (hitPrefix !== null) {
- return {
- prefix: hitPrefix,
- value: str.slice(hitPrefix!.length),
- };
- }
- return null;
- })
+ return null;
+ },
+ )
.filter((entity): entity is MentionsEntity => !!entity && !!entity.value);
};
@@ -75,6 +77,8 @@ class Mentions extends React.Component {
focused: false,
};
+ private rcMentions: any;
+
onFocus: React.FocusEventHandler = (...args) => {
const { onFocus } = this.props;
if (onFocus) {
@@ -125,6 +129,18 @@ class Mentions extends React.Component {
return filterOption;
};
+ saveMentions = (node: typeof RcMentions) => {
+ this.rcMentions = node;
+ };
+
+ focus() {
+ this.rcMentions.focus();
+ }
+
+ blur() {
+ this.rcMentions.blur();
+ }
+
renderMentions = ({ getPrefixCls, renderEmpty }: ConfigConsumerProps) => {
const { focused } = this.state;
const { prefixCls: customizePrefixCls, className, disabled, ...restProps } = this.props;
@@ -146,6 +162,7 @@ class Mentions extends React.Component {
filterOption={this.getFilterOption()}
onFocus={this.onFocus}
onBlur={this.onBlur}
+ ref={this.saveMentions}
>
{this.getOptions()}