How to disable auto-complete or auto-fill in react-select?

Question

How to disable auto-complete or auto-fill in react-select? I need an answer without the involvement of the Input custom component. Can you guys please help me to figure it out?

Answer 1

You can use custom Input component and can use that component with react-select. Something like this:-

import Select, { components } from 'react-select'

const Input = ({ ...rest }) =>
<components.Input {...rest} autoComplete={'nope'} />

<Select {...rest} components={{ Input }} />

Chrome now ignores autoComplete="off" unless it is on the <form autocomplete="off"> tag. So, that's why I'm using random string autoComplete="off"