Search code examples
reactjsconditional-rendering

Is it possible to conditionally render only the placeholder attribute in a input tag in React?

I want to do something like the following:

        return (
          <input  
            {(tagsArrayEmpty) ? placeholder='enter your tags' : placeholder='empty'}
            type="text"
          />
        )

but I get the error: Parsing error: Unexpected token, expected "..."

Is it possible to conditionally render just the placeholder portion of the input tag rather than the full input tag? I read the documentation for conditional rendering here but all the examples only render full tags at a minimum. Just wondering if there is a way.

Solution

  • Sure, like this:

           return (
          <input  
            placeholder={tagsArrayEmpty ? 'enter your tags' : 'empty'}
            type="text"
          />
        )