to 3

Author: zombieJ

examples/split.js

@@ -7,7 +7,8 @@ import '../assets/index.less';
 const { Option } = Mentions;
 
 function validateSearch(text) {
-  return text.length <= 5;
+  console.log('~~>', text);
+  return text.length <= 3;
 }
 
 class Demo extends React.Component {
@@ -17,7 +18,7 @@ class Demo extends React.Component {
     return (
       <div>
         <h1>Customize Split Logic</h1>
-        <p>Only validate string length less than 5</p>
+        <p>Only validate string length less than 3</p>
         <Mentions
           style={{ width: '100%', fontSize: 50 }}
           split=""

src/Mentions.tsx

@@ -140,7 +140,7 @@ class Mentions extends React.Component<MentionsProps, MentionsState> {
   public onKeyUp: React.KeyboardEventHandler<HTMLTextAreaElement> = event => {
     const { key, which } = event;
     const { measureText: prevMeasureText, measuring } = this.state;
-    const { prefix = '', split = ' ', onSearch, validateSearch } = this.props;
+    const { prefix = '', onSearch, validateSearch } = this.props;
     const target = event.target as HTMLTextAreaElement;
     const selectionStartText = getBeforeSelectionText(target);
     const { location: measureIndex, prefix: measurePrefix } = getLastMeasureIndex(
@@ -153,22 +153,21 @@ class Mentions extends React.Component<MentionsProps, MentionsState> {
       return;
     }
 
-    // Skip if is the last one
-    if (KeyCode.RIGHT === which && target.selectionStart === target.value.length) {
-      return;
-    }
-
     if (measureIndex !== -1) {
       const measureText = selectionStartText.slice(measureIndex + measurePrefix.length);
       const validateMeasure: boolean = validateSearch!(measureText, this.props);
       const matchOption: boolean = !!this.getOptions(measureText).length;
 
-      if (key === measurePrefix || measuring || (measureText !== prevMeasureText && matchOption)) {
-        this.startMeasure(measureText, measurePrefix, measureIndex);
-      }
-
-      // Stop if measureText is invalidate
-      if (measuring && !validateMeasure) {
+      if (validateMeasure) {
+        if (
+          key === measurePrefix ||
+          measuring ||
+          (measureText !== prevMeasureText && matchOption)
+        ) {
+          this.startMeasure(measureText, measurePrefix, measureIndex);
+        }
+      } else if (measuring) {
+        // Stop if measureText is invalidate
         this.stopMeasure();
       }