Cascader: escape special characters for regexp

Author: jikkai

packages/cascader/src/main.vue

@@ -70,7 +70,7 @@ import emitter from 'element-ui/src/mixins/emitter';
 import Locale from 'element-ui/src/mixins/locale';
 import { t } from 'element-ui/src/locale';
 import debounce from 'throttle-debounce/debounce';
-import { generateId } from 'element-ui/src/utils/util';
+import { generateId, escapeRegexpString } from 'element-ui/src/utils/util';
 
 const popperMixin = {
   props: {
@@ -337,7 +337,8 @@ export default {
       }
 
       let filteredFlatOptions = flatOptions.filter(optionsStack => {
-        return optionsStack.some(option => new RegExp(value, 'i').test(option[this.labelKey]));
+        return optionsStack.some(option => new RegExp(escapeRegexpString(value), 'i')
+          .test(option[this.labelKey]));
       });
 
       if (filteredFlatOptions.length > 0) {

packages/select/src/option.vue

@@ -17,7 +17,7 @@
 
 <script type="text/babel">
   import Emitter from 'element-ui/src/mixins/emitter';
-  import { getValueByPath } from 'element-ui/src/utils/util';
+  import { getValueByPath, escapeRegexpString } from 'element-ui/src/utils/util';
 
   export default {
     mixins: [Emitter],
@@ -129,9 +129,7 @@
       },
 
       queryChange(query) {
-        // query 里如果有正则中的特殊字符，需要先将这些字符转义
-        let parsedQuery = String(query).replace(/(\^|\(|\)|\[|\]|\$|\*|\+|\.|\?|\\|\{|\}|\|)/g, '\\$1');
-        this.visible = new RegExp(parsedQuery, 'i').test(this.currentLabel) || this.created;
+        this.visible = new RegExp(escapeRegexpString(query), 'i').test(this.currentLabel) || this.created;
         if (!this.visible) {
           this.select.filteredOptionsCount--;
         }

src/utils/util.js

@@ -82,3 +82,5 @@ export const valueEquals = (a, b) => {
   }
   return true;
 };
+
+export const escapeRegexpString = value => String(value).replace(/[|\\{}()[\]^$+*?.]/g, '\\$&');