0

So I have a list of initial selected items which I receive from the parent component. something like this

props.initialSelectedItems = [{id:1, name: 'itemABC'}, {id: 10, name: 'helloWorld'}]

In this same component I have the an array with all the available items:

itemsArr = [{id:1, name: 'itemABC'}, {id: 2, name: 'item123'}.... {id:100, name:'OneMoreItem'}]

So I want to render this list and when theres a match with the item on props.initialSelectedItems I want to add a className to that item. So I have the following code

    const checkInitialState = (itemId: number): boolean => {
        for (let i = 0; i<props.initialSelectedItems.length; i++) {
            const initial = props.initialSelectedItems[i];
            return initial.id === itemId;    
        }
    }

const createItemRows = (itemsArr: Item[]): any => {
        let resultsRow= [];

        for(let i=0; i<itemsArr.length; i++){
            const item: Item = itemsArr[i];
            const isInitialSelected: boolean = checkInitialState(item.id);
            resultsRow.push(
                <div key={i}
                    className={`list__row ${isInitialSelected && 'initial-selected'}`}
                >
.....

So my problem is that it only return true for one of the matched items. What am I doing wrong?

buzatto
  • 9,704
  • 5
  • 24
  • 33
saomi
  • 855
  • 5
  • 16
  • 38

0 Answers0