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

153
Visualizações
How can I use variables and/or loops to more easily and with less code get the key from an object and set a url based on this?

I have a useEffect in a custom react hook where I want to set the URL-link on a button to be depending on which tag that I get from the user in an object. The User-object is an array with several objects all the with the key "Name", but I only want to get the value from the keys(Name) that equals 'small', 'medium' or 'high' (if they exist on the user-object).

Right now I'm doing this - which works - but I think it must be an easier way by comparing or looping through array or objects and maybe setting the url and the value from "Name" to variables, so that I don't have to use so many lines if it were to become a bigger project, but I can't find a good way with less code that works.

So to be more clear; what I want to do is: If the user-object contains a value for instance that is called 'medium', I want to set the url to ${mediumUrl}?a=${user.UserID}.

I use hasTag to see if any values (small, medium, high) even exists, so that I can set it to true or false which decides to show the page or button with the URL at all, since I don't want the page or the button to be shown if the user does not have any of the right values.

I hope this isn't too confusing and please let me know if it is and I can try to clarify. I'm pretty new to JavaScript. Thank you!

const [showPage, setShowPage] = useState(true);

    const hasTag = userTags.some(
//UserTag is the interface for the user-tags.
      (tag: UserTag) =>
        tag.Name === 'small' ||
        tag.Name === 'medium' ||
        tag.Name === 'high'
    );

    switch (userTags.some(tag => tag?.Name)) {
      case userTags.some(tag => tag?.Name === 'small'):
        setWheelUrl(`${smallUrl}?a=${user.UserID}`);
        setLoading(false);
        break;
      case userTags.some(tag => tag?.Name === 'medium'):
        setWheelUrl(`${mediumUrl}?a=${user.UserID}`);
        setLoading(false);
        break;
      case userTags.some(tag => tag?.Name === 'high'):
        setWheelUrl(`${highUrl}?a=${user.UserID}`);
        setLoading(false);
        break;
      default:
        setLoading(false);
    }

  if(!hasTag) {
    setShowPage(false)
  }
about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

We can directly find the desired tag and then use the name property inside it in the switch.

    const [showPage, setShowPage] = useState(true);

// should directly find the tag with correct value using 'find' operator
    const tag = userTags.find(
      (tag: UserTag) =>
        tag.Name === 'small' ||
        tag.Name === 'medium' ||
        tag.Name === 'high'
    );

    switch (tag?.Name)) { // no need to calculate in every case
      case 'small':
        setWheelUrl(`${smallUrl}?a=${user.UserID}`);
        setLoading(false);
        break;
      case 'medium':
        setWheelUrl(`${mediumUrl}?a=${user.UserID}`);
        setLoading(false);
        break;
      case 'high':
        setWheelUrl(`${highUrl}?a=${user.UserID}`);
        setLoading(false);
        break;
      default:
        setLoading(false);
    }

  if(!tag) {
    setShowPage(false)
  }
about 4 years ago · Juan Pablo Isaza Relatório
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