const useGetFirstLetters = (
option,
key,
splitStr
) => {
const firstLettersParts =
typeof option[key] === 'string' ? option[key].split(splitStr) : []
const firstLetters = firstLettersParts
.map((part) => String(part.charAt(0)).toLowerCase())
.join('')
const joinLetters = firstLettersParts.join('').toLowerCase()
console.log('首字母:', firstLettersParts, firstLetters)
return {
firstLetters,
firstLettersParts,
joinLetters
}
}
const useFilterSelectOpt = ({
inputValue,
options,
keys,
filterFirstKeys,
splitStr,
callback
})=> {
const _newInputValue =
typeof inputValue === 'string' ? inputValue.toLowerCase() : inputValue
return options.filter((_option) => {
for (const key of keys) {
const value =
typeof _option[key] === 'string'
? _option[key].toLowerCase()
: _option[key]
if (_newInputValue === value || (typeof value === 'string' && value.includes(_newInputValue))) {
return true
}
}
if (filterFirstKeys && filterFirstKeys.length) {
for (const key of filterFirstKeys) {
const _firstLetters = useGetFirstLetters(_option, key, splitStr || '/')
if (
_newInputValue === _firstLetters.firstLetters ||
_firstLetters.joinLetters.includes(_newInputValue)
) {
return true
}
}
}
if (callback) callback(_option)
return false
})
}
const options = [
{
label: '北京',
value: '0011',
pinyin: 'bei/jing'
},
{
label: '天津',
value: '0012',
pinyin: 'tian/jin'
},
{
label: '上海',
value: '0013',
pinyin: 'shang/hai'
},
{
label: '深圳',
value: '0014',
pinyin: 'shen/zhen'
},
{
label: '广州',
value: '0015',
pinyin: 'guang/zhou'
},
{
label: '武汉',
value: '0016',
pinyin: 'wu/han'
},
{
label: '重庆',
value: '0017',
pinyin: 'chong/qing'
},
{
label: '长沙',
value: '0018',
pinyin: 'chang/sha'
},
{
label: '郑州',
value: '0019',
pinyin: 'zheng/zhou'
},
{
label: '青岛',
value: '0020',
pinyin: 'qing/dao'
},
]
const inputValue = 123
const newOptions = useFilterSelectOpt({inputValue, options, keys: ['label', 'pinyin'], filterFirstKeys: ['pinyin']})
console.log("编译后的值:")
console.log(newOptions)