Filter values from state - reactjs

Question

AutoComplete Class
import React from 'react';
import axios from 'axios';
import DeleteItem from '../DeleteItem/DeleteItem'
export default class AutoComplete extends React.Component{
constructor(props){
super(props)
this.state={
suggestions:[],
text:'',
persons:[],
delsuggestions:[],
}
this.delete = this.delete.bind(this);
}
// Here I am calling api
componentDidMount() {
axios.get(`https://jsonplaceholder.typicode.com/users`)
.then(res => {
const persons = res.data;
this.setState({ persons:persons });
})
}
//on entering values
onTextChanged= (e) =>{
const value=e.target.value;
let suggestions=[];
if(value.length>0){
suggestions=this.state.persons.map(item =>(item.name))
.filter(function(val){
return val.indexOf(value) > -1
})
}
this.setState(()=>({suggestions:suggestions,text:value}))
}
//On selecting a value from listitems
personSelected(value){
this.setState(()=>({
text:value,
persons:[],
}))
}
//delete function
handleDelete=id =>{
let delsuggestions=[];
this.setState(()=>({delsuggestions:[...this.state.suggestions].filter(el => el!= id)}))
console.log('delsuggestions'+delsuggestions)
}
//listing out filtered items
renderPersons(){
const {persons}=this.state
return(
<React.Fragment>
{this.state.suggestions.map(item => (
<DeleteItem
key={item}
searchitem={item}
onDelete={this.handleDelete}
/>
))}
</React.Fragment>
)
}
//render function
render(){
const {text} = this.state;
return(<div>
<input value={text} onChange={this.onTextChanged} type='text' style={{backgroundColor:'pink'}} />
{this.renderPersons()}
</div>)
}
}
DeleteItem Class
import React, { Component } from "react";
class DeleteItem extends Component {
render() {
return (
<div className="deletebuttom">
{this.props.searchitem} <button
onClick={() => this.props.onDelete(this.props.searchitem)}
>
Delete
</button>
</div>
);
}
}
export default DeleteItem;
what's problem with the below filter function
handleDelete=id =>{
let delsuggestions=[];
this.setState(()=>({delsuggestions:this.state.suggestions.filter(el => el.id != id)}))
console.log('delsuggestions'+delsuggestions)
}
I am not getting filtered values in delsuggestions.When I debug "unexpected end of input" is displayed onhover of el.