-2

I'm new to react typescript, here i have props and its types, everything is fine except this part : collapseStates["" + el.name + el.identifier] = true; it gives error: Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '{}'. No index signature with a parameter of type 'string' was found on type '{}'.ts(7053)

what is the right way of adding : collapseStates = {} to interface AA? as you can see it should contain strings collapseStates["" + el.name + el.identifier] Any help or advice is appreciated

  interface AA{
  action: "sites" | "analysers";
  actionArgs?: string;
  name: string;
  identifier: string;
}
  
  const Article: React.FC<AA> = (props) => {

  let [state, setState] = useState<AA>({
    actionArgs: props.actionArgs,
    collapseStates: {} ,
  });
 const handleExpandClick = (event, key) => {
setState({
  collapseStates: {
    ...state.collapseStates,
    [key]: !state.collapseStates[key],
  },
});
  };

 const initialize = () => {
    let collapseStates = {};
    articles.map((el: AA) => {
      collapseStates["" + el.name + el.identifier] = true;
      return;
    });

    setState({
      ...state,
      collapseStates: collapseStates,
    });
  };
  }

1 Answers1

0

You can type collapseStates as a Record:

interface AA{
  ...
  collapseStates: Record<string,boolean>;
}
Dennis Vash
  • 50,196
  • 9
  • 100
  • 118
  • i still get same error –  Oct 17 '21 at 16:19
  • Just make a sandbox that reflects the error, read [How to create a Minimal, Reproducible Example](https://stackoverflow.com/help/minimal-reproducible-example) – Dennis Vash Oct 17 '21 at 16:20
  • i cant put more code than that, but i did exactly as you said and still getting same error –  Oct 17 '21 at 16:27