Show secureTextEntry on TextInput if props is true-CodePudding

I have the TextInput component where I am passing in the props passwordType. So on my TextInput component I type this:

 <TextInput
        placeholder={placeholderText}
        {...restOfProps}
        onFocus={handleFocus}
        onBlur={handleBlur}
        style={styles.input}
        {passwordType && (secureTextEntry={!showPassword})}
      />

As you can see on this part of the code {passwordType && (secureTextEntry={!showPassword})} I am trying to show the secureTextEntry only if this passwordType props is passed on my main component.

However, this is returning an error Cannot find name 'secureTextEntry'.ts(2304). ')' expected.ts(1005).

What is the proper way of doing this conditional inside a TextInput? `

CodePudding user response：

You need to keep the property secureTextEntry on the left and the conditional statement on the right.

 <TextInput
        placeholder={placeholderText}
        {...restOfProps}
        onFocus={handleFocus}
        onBlur={handleBlur}
        style={styles.input}
        secureTextEntry={passwordType ? true : false} 
      />