Check for empty string in JSX

Question

Is there a way in React/JSX to check if a user's input string is empty?

Component.js

{((this.props.description.name ==" ")||(this.props.description.name.length==""))? 

This condition works when a user inputs nothing or an empty string that is 1 space long, but if the empty string is more than 1 space long it fails. Is there a trick with JSX to check this or should I handle this in my reducer?

Answer 1

You could check for trimmed string:

{this.props.description.name.trim() == ""}

This trims the string (which removes whitespace and newlines) and then check is if it's an empty string. Here's a CodePen demonstration.