DEV Community

Sahil kashyap
Sahil kashyap

Posted on

React native Search In SectionList

Image of SectionList with Search

SectionList with Search
Requirement: Add search in SectionList of react native

Here's Js code for filtering used

const sectionList = [{ caption: 'caption1', data: [{ id: '1', title: 'Payment', description: 'Pay info', }, { id: '2', title: 'Refund', description: 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dicta et ipsam voluptate commodi nulla asperiores corporis, sapiente quasi obcaecati quae totam consequatur cum, perspiciatis pariatur !', }, { id: '3', title: 'Mobs', description: 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dicta et ipsam voluptate commodi nulla asperiores corpori!', }, { id: '4', title: 'test', description: 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dicta et ipsam voluptate commodi nulla', }, ], }, { caption: 'caption2', data: [{ id: '5', title: 'Lorem ipsum, dolor sit amet consectetur adipisicing elit. Recusandae eveniet?', description: 'Custom desc', },{ id: '9', title: 'Lorem ipsum, dolor sit amet consectetur adipisicing elit. Recusandae eveniet?', description: 'Lorem ipsum Custom desc', }, ], }, ]; const query = 'Lorem ipsum' // Not working const res = sectionList .map(d => ({ ...d, data: d.data.filter(c => c.description.includes(query)) })) .filter(d => d.data.length) console.log(res); 
Enter fullscreen mode Exit fullscreen mode

Top comments (0)