我正在使用react-native-autocomplete-input在React Native中编写一个自动完成输入。到目前为止,一切正常,除非我为输入输入了特殊的正则表达式字符,例如'(',我得到一个错误'无效的正则表达式:missing)或'*',错误为'无效的正则表达式,无可重复
我正在尝试匹配国家/地区名称,并且某些国家/地区带有括号,但是如果用户键入?或*,我不希望该应用崩溃。
以下是搜索名称为的国家/地区的对象的功能
findCountry = (query) => {
if (query === '') {
return [];
}
const regex = new RegExp(`${query.trim()}`, 'i');
return countries.filter(country => country.name.search(regex) >= 0);
}
我认为错误在那儿。如何设置正则表达式过滤器,使其忽略输入中的特殊字符?
这是自动完成渲染功能:
render() {
const { query } = this.state;
const countries = this.findCountry(query);
const comp = (a, b) => a.toLowerCase().trim() === b.toLowerCase().trim();
var { fetchingCountries, handleSearch } = this.props;
return (
<View style={styles.container}>
<Autocomplete
autoCapitalize="none"
autoCorrect={false}
containerStyle={styles.autocompleteInput}
data={countries.length === 1 && comp(query, countries[0].name) ? [] : countries}
defaultValue={query}
onChangeText={text => this.setState({ query: text })}
placeholder="Search for a Country or Territory"
renderItem={({ name }) => (
<TouchableOpacity onPress={() => this.setState({ query: name })}>
<Text style={styles.queryText}>
{name}
</Text>
</TouchableOpacity>
)}
/>
<TouchableOpacity
style={styles.searchButton}
onPress={() => handleSearch(query)}
>
{
fetchingCountries
? <ActivityIndicator size="small" color="white" />
: <Text style={styles.buttonText}>Search</Text>
}
</TouchableOpacity>
</View>
);
}
}