SecureField(props: {
placeholder?: string;
text: string;
setText: (text: string) => void;
}): Component;
Placeholder text displayed when the field is empty.
The current text value of the field (displayed as masked characters).
setText
(text: string) => void
required
Callback invoked when the user types. Use this to update your state.
Support
Usage
Basic password field
const body = () => {
const [password, setPassword] = useState("")
return SecureField({
placeholder: "Password",
text: password,
setText: setPassword
})
}
const body = () => {
const [email, setEmail] = useState("")
const [password, setPassword] = useState("")
return VStack({ spacing: 16 }, [
TextField({
placeholder: "Email",
text: email,
setText: setEmail
})
.textFieldStyle("roundedBorder"),
SecureField({
placeholder: "Password",
text: password,
setText: setPassword
})
.textFieldStyle("roundedBorder"),
Button("Sign In", () => {})
.disabled(email === "" || password === "")
])
.padding(24)
}
See Also