loading indicate

This commit is contained in:
Sergey Yarkov 2020-09-28 19:25:54 +03:00
parent 46cb2a4d25
commit 975d1cf8bb

View File

@ -5,10 +5,13 @@ const Newsletter = () => {
const [email, setEmail] = React.useState("") const [email, setEmail] = React.useState("")
const [success, setSuccess] = React.useState(false) const [success, setSuccess] = React.useState(false)
const [error, setError] = React.useState({ isError: false, message: "" }) const [error, setError] = React.useState({ isError: false, message: "" })
const $subscribeButton = React.useRef()
const submitHandler = async e => { const submitHandler = async e => {
try { try {
e.preventDefault() e.preventDefault()
document.body.style.cursor = "wait"
$subscribeButton.current.style.cursor = "wait"
if ( if (
!email.match( !email.match(
@ -32,11 +35,15 @@ const Newsletter = () => {
}) })
window.setTimeout(() => setError({ isError: false, message: "" }), 5000) window.setTimeout(() => setError({ isError: false, message: "" }), 5000)
console.log(data.msg) console.log(data.msg)
document.body.style.cursor = "auto"
$subscribeButton.current.style.cursor = "pointer"
return return
} }
setSuccess(true) setSuccess(true)
window.setTimeout(() => setSuccess(false), 5000) window.setTimeout(() => setSuccess(false), 5000)
document.body.style.cursor = "auto"
$subscribeButton.current.style.cursor = "pointer"
} catch (error) { } catch (error) {
console.log(error) console.log(error)
setSuccess(false) setSuccess(false)
@ -67,9 +74,10 @@ const Newsletter = () => {
value={email} value={email}
onChange={handleChangeEmail} onChange={handleChangeEmail}
placeholder="ваш e-mail" placeholder="ваш e-mail"
type="email"
name="email" name="email"
/> />
<button>Подписаться</button> <button ref={$subscribeButton}>Подписаться</button>
</div> </div>
</form> </form>
{success ? ( {success ? (