反应选择不允许在搜索文本中使用星号 (*) 进行搜索

Question

当我搜索带有星号(*(字符的数据时，ajax返回结果，但它不会显示在选择列表中。

例：

我有按starts_with搜索的搜索引擎，对于部分搜索，我需要在字符串前面添加星号(*(。

• 苹果
• 菠萝
• 结皮苹果
• 越橘
• 黑莓

如果我搜索App它会返回以下结果

• 苹果
• 结皮苹果

为了让Pineapple包含在列表中，我需要在苹果前面添加星号，就像*apple

当我添加星号(*(时，ajax 调用返回结果，但结果未显示在列表中。

Answer 1

我已经按照此处的建议覆盖了react-select的filterOptions道具 - 不允许使用模式搜索在搜索文本中使用星号(*(进行搜索。

filterOptions(options, filterValue, excludeOptions, props) {
var _this = this;
var patternSearch = false;
if(filterValue.contains("*")) {
filterValue = filterValue.replace(/[*]/g, "[a-zA-Z0-9]*");
patternSearch = true;
}
if (props.ignoreCase) {
filterValue = filterValue.toLowerCase();
}
if (excludeOptions) excludeOptions = excludeOptions.map(function (i) {
return i[props.valueKey];
});
return options.filter(function (option) {
if (excludeOptions && excludeOptions.indexOf(option[props.valueKey]) > -1) return false;
if (props.filterOption) return props.filterOption.call(_this, option, filterValue);
if (!filterValue) return true;
var valueTest = String(option[props.valueKey]);
var labelTest = String(option[props.labelKey]);
if (props.ignoreCase) {
if (props.matchProp !== 'label') valueTest = valueTest.toLowerCase();
if (props.matchProp !== 'value') labelTest = labelTest.toLowerCase();
}
if (patternSearch) {
return props.matchProp !== 'value' && labelTest.match(sfilterValue);
}
else {
return props.matchPos === 'start' ? props.matchProp !== 'label' && valueTest.substr(0, filterValue.length) === filterValue || props.matchProp !== 'value' && labelTest.substr(0, filterValue.length) === filterValue : props.matchProp !== 'label' && valueTest.indexOf(filterValue) >= 0 || props.matchProp !== 'value' && labelTest.indexOf(filterValue) >= 0;
}
});
}