Question 375144 in Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – Quesion in reactjs component parameter if case

Sorry if I use the wrong term I don’t know what the correct terminology. Please correct me if you could.

Let say I have a form I want to have some if case to configure it.

<Form.Select
 name="select"
 value= {isTrue?value1:value2}
 multiple = {enableMultiple}>

as you can see value can use a short form if-case to set the value

But for multiple this example will fail because I have to either have or don’t have the parameter to enable/disable it, not by setting it true/false

So is there is short form for setting on/off the variable multiple in Form.Select? I am trying to doing the following

{enableMutiple ? <Form.Select value=... mutiple ...> : <Form.Select value=...>}
Tags:

3

Answers


  1. 0

    Here, on my machine works XD

    const a = true;
return (
  <select multiple={a}>
    <option></option>
    <option></option>
    <option></option>
  </select>
);

    The react docs are saying that it’s acceptable to pass the boolean multiple or do not pass it at all.
    enter image description here

    Login or Signup to reply.
  2. 0

    using the enableMultiple && true syntax for conditional rendering of the multiple attribute in a form element is a concise and efficient way to handle such scenarios. It makes your code cleaner and easier to understand, improving readability and maintainability. This approach is a common practice in JavaScript and React development, allowing you to toggle attributes based on specific conditions without unnecessary repetition of code. Overall, it enhances the development process and helps you write more streamlined and organized code.
    note:If your bets are high, it is better to use a switch case

        <Form.Select
  name="select"
  value={isTrue ? value1 : value2}
  multiple={enableMultiple && true}
>
  {/* Your select options here */}
</Form.Select>
    Login or Signup to reply.
  3. 0

    If you really want to omit the property altogether, you can try to spread an object with properties, which could either contain the multiple property or not.

    <Form.Select
  name="select"
  value= {isTrue ? value1 : value2}
  {...(enableMultiple ? {multiple: true} : {})}
>

    But if your original attempt is really not working, then i would file a bug with that library.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search