CODEWITHSUNDEEP
reactjstypescripttypescript-generics
artur nowakowski
artur nowakowski

Reputation: 1

How can I make argument assignable to proper parameter?

I am new to typescript and I have following error bound with setFilteredColumns(obj)

Argument of type '(false | Column)[]' is not assignable to parameter of type 'SetStateAction<Column[] | undefined>'. Type '(false | Column)[]' is not assignable to type 'Column[]'. Type 'false | Column' is not assignable to type 'Column'. Type 'boolean' is not assignable to type 'Column'.ts(2345)

interface ColumnsHeader {
  title: string;
  disp: boolean;
}
export interface Column {
  col: ColumnsHeader;
}
interface IProps{
  tocompare:Column[];
   columns:Column[]
}
const useBuildColumns = ({tocompare, columns}:IProps) => {
  const [filteredColumns, setFilteredColumns] = useState<Column[]>();
  useEffect(() => {

      let obj = tocompare &&
      tocompare.map((k:Column, ii:number) => {
        return columns[ii] && columns[ii].col.disp === true && k;
      })

         setFilteredColumns(obj);
  }, [columns]);

  return [filteredColumns];
};

How can I resolve this error?

Upvotes: 0

Views: 41

Answers (1)

rycha
rycha

Reputation: 794

The problem is that you use logical operators everywhere, even where it leads to a distortion of the result. In your example map function can return false. I didn't quite understand what was going in useEffect, maybe you tried to make something like this:

useEffect(() => {
      if (tocompare) {
        let obj = tocompare.filter(
           (k: Column, ii: number) => columns[ii] && columns[ii].col.disp
        );

        setFilteredColumns(obj);
      }
    }, [columns]);

Remember that logical operators returns a boolean value

Upvotes: 0

Related Questions