Autocomplete example throws typescript error

Question

I am trying to use Autocomplete MUI example, it throws me typescript error

[TypeScript] 'event' is declared but its value is never read.

import * as React from 'react';
import TextField from '@mui/material/TextField';
import Autocomplete from '@mui/material/Autocomplete';

const options = ['Option 1', 'Option 2'];

export default function ControllableStates() {
  const [value, setValue] = React.useState<string | null>(options[0]);
  const [inputValue, setInputValue] = React.useState('');

  return (
    <div>
      <div>{`value: ${value !== null ? `'${value}'` : 'null'}`}</div>
      <div>{`inputValue: '${inputValue}'`}</div>
      <br />
      <Autocomplete
        value={value}
        onChange={(event: any, newValue: string | null) => {
          setValue(newValue);
        }}
        inputValue={inputValue}
        onInputChange={(event, newInputValue) => {
          setInputValue(newInputValue);
        }}`your text`
        id="controllable-states-demo"
        options={options}
        sx={{ width: 300 }}
        renderInput={(params) => <TextField {...params} label="Controllable" />}
      />
    </div>
  );
}

I don't see, what is going wrong, as I just used the MUI example without any changes. Do I need to do any tsconfig change?

The warning is just telling you that you are not using your event parameter. try setting a `console.log(event)` in the function body and the warning should go away. — Nils Kähler, Jul 05 '23 at 06:48
It's not an error. It's just a warning (or a kind of remainder) and can be ignored. Refer: https://stackoverflow.com/questions/50011443/tslint-how-to-disable-error-somevariable-is-declared-but-its-value-is-never-rea — Shri Hari L, Jul 05 '23 at 06:48
Does this answer your question? [tslint how to disable error "someVariable is declared but its value is never read"](https://stackoverflow.com/questions/50011443/tslint-how-to-disable-error-somevariable-is-declared-but-its-value-is-never-rea) — Shri Hari L, Jul 05 '23 at 06:48

Kedar · Answer 1 · 2023-07-05T09:29:00.630

3

Please check below thread. It may solve your issue.

tslint how to disable error "someVariable is declared but its value is never read"

edited Jul 05 '23 at 09:29

answered Jul 05 '23 at 06:48

Kedar

523
2
11

If I do that, it throws error "[TypeScript] Argument of type 'SyntheticEvent' is not assignable to parameter of type 'SetStateAction'." onInputChange expects props for event I think – Adeveloper Jul 05 '23 at 07:13
1

@Adeveloper can you check this thread and apply the solution : https://stackoverflow.com/questions/50011443/tslint-how-to-disable-error-somevariable-is-declared-but-its-value-is-never-rea – Kedar Jul 05 '23 at 07:18
noUnusedParameters false fixed the error @kedar-thakkar – Adeveloper Jul 05 '23 at 09:26
1

@Adeveloper great ! I have edited my answer – Kedar Jul 05 '23 at 09:29

Autocomplete example throws typescript error

1 Answers1