Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

232
Visualizações
React reuse functions used

So I implemented a react-select on my form in my react app for getting a value for a specific variable that i need, but the variable is not only one, I have many of it and i need to create a react select for each of them

here is a piece of my code for rendering the select

<p><span className='openbookclassname'>Material type: &nbsp; </span></p>    
<Creatable
        isClearable
        value={materialValue}
        options={materialOptions}
        onChange={materialhandleChange}
        onCreateOption={materialhandleCreate}
        classNamePrefix="materialtype"
        styles={customStyles}

/>

and these are its functions, its somehow long but is there anyway that i can reuse this function for each of my select variable without overlapping their functions(or data that is passed to them) because each variable will have different use value(state value) in their react-select.

const [materialValue, setmaterialValue] = useState();
  const [materialOptions, setmaterialOptions] = useState([
  { value: 'books', label: 'books' },
  { value: 'newspaper', label: 'Newspapers' },
  { value: 'theses and dissertation', label: 'TheseTheseTheses and Dissertation' },
  ]);

  const materialhandleChange = useCallback((inputValue) => setmaterialValue(inputValue), []);console.log(materialValue);

  const materialhandleCreate = useCallback(
    (inputValue) => {
      const newValue = { materialValue: inputValue.toLowerCase(), label: inputValue };
      setmaterialOptions([...materialOptions, newValue]);
      setmaterialValue(newValue);
    },
    [materialOptions]
  );

::sorry im not good at explaining but to make it short, i want to also get other variable data from user, the first one is the Material type which is the thing that i did here, but i want to also have other variables such as Publisher, availability ,(i will also use react select on them) but i dont like rewriting those functions over and over again and edit the functionality/var names on it so that they will not overlap with each other, so i'm looking for a way to shorten my code

about 4 years ago · Santiago Gelvez
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda