Lightning Web Components Specialist Superbadge Solution Boat Search Component
- Get link
- X
- Other Apps
BOAT SEARCH COMPONENT
boatSearch.html
<template>
<lightning-layout multiple-rows>
<!-- Top -->
<lightning-layout-item size="12">
<lightning-card title="Find a Boat">
<!-- New Boat button goes here -->
<lightning-button variant="brand" label="New Boat" slot="actions" onclick={createNewBoat}>
</lightning-button>
<p class="slds-var-p-horizontal_small slds-align_absolute-center">
<!-- <c-boat-Search-Form></c-boat-Search-Form> -->
<c-boat-search-form onsearch={searchBoats}></c-boat-search-form>
<!-- boatSearchForm component goes here -->
</p>
</lightning-card>
</lightning-layout-item>
<!-- Bottom -->
<lightning-layout-item size="12" class="slds-p-top_small slds-is-relative">
<!-- Spinner goes here -->
<template if:true={isLoading}>
<lightning-spinner alternative-text="Loading" variant="brand"></lightning-spinner>
</template>
<!-- <c-boat-Search-Results></c-boat-Search-Results> -->
<!-- boatSearchResults goes here -->
<!-- onloading={handleLoading} ondoneloading={handleDoneLoading} -->
<c-boat-search-results onloading={handleLoading} ondoneloading={handleDoneLoading} ></c-boat-search-results>
</lightning-layout-item>
</lightning-layout>
</template>
- Get link
- X
- Other Apps
Comments
Post a Comment