highLightText = (prope) => {
const {searchval,list} = this.state
let matchVal = [];
list.forEach((item, index) => {
let isMatch = true,
rawVal = item[prope]
matchVal[index] = []
while (isMatch) {
let pos = rawVal.indexOf(searchval)
if (pos === -1) {
isMatch = false
matchVal[index].push({ [prope]: rawVal.substring(0, rawVal.length),name: item.name })
} else {
let matchEnd = pos + searchval.length
matchVal[index].push({ [prope]: rawVal.substring(0, pos),name: item.name })
matchVal[index].push({ [prope]: rawVal.substring(pos, matchEnd), matched: true,name: item.name })
rawVal = rawVal.substring(matchEnd, rawVal.length)
if (!rawVal && rawVal.length < 1) {
isMatch = false
}
}
}
})
return matchVal
}
render() {
const {list, operaList, isShowContent,loading} = this.state
return (
<div className="box">
operaList.map((item,index) => {
return(
<div key={list[index].id} onClick={() => this.handleClick(list[index].id)}>
<span>{list[index].name}</span>
{
item.map((subItem,subIndex) => {
return (
<span key={index + subIndex} style={{color: subItem.matched ? '#9b7235' : '#666'}}>
{subItem.id}
</span>
)
})
}
</div>
)
})
}
</div>
)
}