Привет!
Может быть это хард-кодинг, но мне нужно вытащить значение долготы и широты из записи, чтобы передать их в родительский компонент (в элемент lightning-map).
У Salesforce даже компонент есть(lightning:formattedLocation), который по идее должен хотя бы отобразить это:
https://developer.salesforce.com/docs/component-library/bundle/lightning:formattedLocation/example
Но все равно не видит.
Даже если просто в дочернем вывести {bike.Station__r.Location__latitude__s} - не отобразит.
Я нашел, как доставать значение из SOQL - не просто Location__c, а разделяется на два элемента:
SELECT Id, Station__r.Location__latitude__s, Station__r.Location__longitude__s, ....
Parent:
JS:
import { LightningElement, track, wire } from 'lwc';
import getBikes from '@salesforce/apex/StationController.getBikes';export default class ChildParent1 extends LightningElement {
@track name;
@track mapMarkers = []
@wire(getBikes) bikes;
handleIt1(event) {
this.name = event.detail.name;
const Latitude = event.detail.loc1;
const Longitude = event.detail.loc2;
this.mapMarkers = [{
location: { Latitude, Longitude },
title: this.name
}];
}
}
HTML:
<template>
<!-- Parent -->
<lightning-card title="From Child to Parent" icon-name="standard:account">
<template if:true={name}>
{name}'s Location:
<lightning-map map-markers={mapMarkers} zoom-level="15"></lightning-map>
</template>
<template if:true={bikes.data}>
<template for:each={bikes.data} for:item="bike">
<div key={bike.Id} style="border: 1px solid black; background-color: lightblue; width:90%;height:auto">
<c-child-parent2 bike={bike} onshow={handleIt1}></c-child-parent2>
</div>
</template>
</div>
</template>
</lightning-card>
</template>
Child:
JS:
import { LightningElement, api } from 'lwc';export default class ChildParent2 extends LightningElement {
@api bike;
handleIt2() {
this.dispatchEvent(new CustomEvent('show', { detail: { name: this.bike.Name, loc1: this.bike.Station__r.Location__latitude__s, loc2: this.bike.Station__r.Location__longitude__s } }));
}
}
HTML:
<template>
<!-- Child -->
{bike.Name}
<lightning-button icon-name="utility:preview" label="Show Info" onclick={handleIt2}></lightning-button>
</template>