use ref hooks Input component

mbdtsmh pro commented 9 months ago

I believe the Typescript types for the function signature are incorrect.

inputRef?: | RefObject<HTMLInputElement> | ((ref: RefObject<HTMLInputElement>) => void) | null;

So the object ref would need to be accessed via ref.current but the type being passed appears to be HTMLInputElement

Piotr Glejzer staff commented 9 months ago

Yea, I think you are right.

Jakub Chmura staff premium commented 11 months ago

You do it wrong. You need to use a function that will be changing everything inside of it.

example:

import React from 'react';
import { MDBInput, MDBBtn } from 'mdbreact';

const InputPage = () => {
  let thisIsAReference = '';

  const myRefFunction = (ref) => {
    thisIsAReference = ref;
  };

  const changeVal = () => {
    thisIsAReference.value = thisIsAReference.value + '1';
  };

  return (
    <>
      <MDBInput
        label='My input'
        name='refInput'
        value='testValue'
        inputRef={myRefFunction}
        type='text'
        icon='user'
      />
      <MDBBtn onClick={changeVal}>Change input val</MDBBtn>
    </>
  );
};

export default InputPage;

behzad soleimani commented 11 months ago

for tabIndex? i need a tabIndex props. only way for that is to use inputref

Jakub Chmura staff premium commented 11 months ago

You can get access to tabIndex using this ref from the example above.