<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
<apiVersion>52.0</apiVersion>
<isExposed>true</isExposed>
<targets>
<target>lightning__RecordAction</target>
<target>lightning__RecordPage</target>
</targets>
<targetConfigs>
<targetConfig targets="lightning__RecordAction">
<actionType>Action</actionType>
</targetConfig>
<targetConfig targets="lightning__RecordPage">
<supportedFormFactors>
<supportedFormFactor type="Small" />
<supportedFormFactor type="Large" />
</supportedFormFactors>
</targetConfig>
</targetConfigs>
</LightningComponentBundle>
@api invoke () {
this.isAction = true;
this.showButton = false;
if(this.recordId && this.objectApiName) this.performHlsCheck();
}
JAVa Script
const columns = [
{ label: 'ID', fieldName: 'id' },
{ label: 'image', fieldName: 'imageType' },
{ label: 'title', fieldName: 'title', type: 'name' },
{ label: 'ready', fieldName: 'readyInMinutes', type: 'number' },
{ label: 'Serving', fieldName: 'servings' },
{ label: 'sourceURL', fieldName: 'sourceUrl' },
];
export default class bitsin extends LightningElement {
columns = columns;
data;
connectedCallback(){
CallOut().then(
result => {
this.data = result;
console.log('THIS THE SUCCESS MES ' + result);
}
).catch( error => {
console.error('this is the error ' + error);
})
}
}
HTML
<template>
<div class="slds-var-m-around_small">
<div style="height: 300px;">
<lightning-datatable
key-field="id"
data={data}
hide-checkbox-column
columns={columns}>
</lightning-datatable>
</div>
</div>
</template>
Apex class
public with sharing class CallOut {
@AuraEnabled(cacheable=true)
public static string spoonacular(){
Http http = new Http();
HttpRequest request = new HttpRequest();
string endpoint = ''URLSAMPLE;
request.setEndpoint(endpoint);
request.setMethod('GET');
httpResponse response = http.send(request);
string donus;
Integer statusCode = response.getStatusCode();
if( statusCode == 200) {
donus = response.getBody();
system.debug('responsee ' + response.getBody());
} else {
system.debug('RESPOnse: ' + response.getBody());
}
return donus;
}
}
JSON return
[
{
"id": 209128,
"imageType": "jpg",
"title": "Dinner Tonight: Grilled Romesco-Style Pork",
"readyInMinutes": 45,
"servings": 4,
"sourceUrl": "http://www.seriouseats.com/recipes/2008/07/grilled-romesco-style-pork-salad-recipe.html"
},
{
"id": 31868,
"imageType": "jpg",
"title": "Dinner Tonight: Chickpea Bruschetta",
"readyInMinutes": 45,
"servings": 2,
"sourceUrl": "http://www.seriouseats.com/recipes/2009/06/dinner-tonight-chickpea-bruschetta-babbo-nyc-recipe.html"
},
..... and so on