User Story
As a new user, I want to fill out a registration form with my name, email, and password, so that I can create an account and access the application.
HTML
<template>
<lightning-card title="Registration Form">
<div class="slds-grid slds-wrap">
<div class="slds-col slds-size_1-of-2">
<lightning-input label="Name" value={name} onchange={handleNameChange}></lightning-input>
</div>
<div class="slds-col slds-size_1-of-2">
<lightning-input type="email" label="Email" value={email} onchange={handleEmailChange}></lightning-input>
</div>
<div class="slds-col slds-size_1-of-2">
<lightning-input type="password" label="Password" value={password} onchange={handlePasswordChange}></lightning-input>
</div>
<div class="slds-col slds-size_1-of-2">
<lightning-button label="Register" variant="brand" onclick={handleRegister}></lightning-button>
</div>
</div>
</lightning-card>
</template>
Java Script
import { LightningElement, track } from 'lwc';
export default class RegistrationForm extends LightningElement {
@track name = '';
@track email = '';
@track password = '';
handleNameChange(event) {
this.name = event.target.value;
}
handleEmailChange(event) {
this.email = event.target.value;
}
handlePasswordChange(event) {
this.password = event.target.value;
}
handleRegister() {
console.log('Registration submitted!');
}
}
Video
Video does not exists.
