Передача данных от родителя к потомку в веб-компоненте Lightning с использованием диаграмм Js

Простой способ сделать это. Попробуйте этот код. Поместите код в свой файл htaccess:

Options +FollowSymLinks

RewriteEngine on

RewriteRule profile/(.*)/ profile.php?u=$1

RewriteRule profile/(.*) profile.php?u=$1   

Он создаст симпатичный URL этого типа:

http://www.domain.com/ Профиль / 12345 /

blockquote>

Для получения дополнительной информации htaccess Довольно URL: http://www.webconfs.com/url-rewriting-tool.php

1
задан Brian 5 March 2019 в 18:48
поделиться

1 ответ

Это решение, которое я придумал.

Родительский контроллер имеет следующую вложенную функцию

@wire(getRecord, { recordId: '$recordId', fields: CONTACT_FIELDS })
wireContact({ error, data }) {
    if (data) {
        console.log('getRecord Data', JSON.stringify(data))
        this.contact = data;
        getAllDateRecords({ contactId: this.recordId })
            .then(result => {
                this.allDateRecords = result;
                this.chartReady = true;
            })
            .catch(err => console.log(JSON.stringify(err)));
    } else if (error) {
        console.error('error', error)
        this.contact = undefined;
    }

}

Родительский компонент имеет компонент c-debt-chart и получает свои данные из записей всех дат :

<template>
<div class="slds-page-header__row slds-accordion__content">
                <div class="c-container w-100">
                    <lightning-layout horizontal-align="space">
                        <lightning-layout-item padding="around-small">
                            <template if:true={chartReady}>
                                <c-debt-chart all-date-records={allDateRecords}></c-debt-chart>
                            </template>
                        </lightning-layout-item>
                    </lightning-layout>
                </div>
            </div>
<template>

Проблема заключалась в том, что примеры в Salesforce не показывают, как обновить данные в диаграммах js. Это решение, которое я нашел, используя Getter and Setters

Диаграмма задолженности дочерних компонентов

<template>
    <lightning-card title="Debt Overview" icon-name="standard:currency">
        <div class="slds-m-around_medium">
            <canvas class="donut" lwc:dom="manual"></canvas>
        </div>
    </lightning-card>
</template>

Контроллер диаграммы задолженности

Каждый раз переменная allDateRecords изменяется на родительском уровне. Это приведет к тому, что дочерний процесс будет обновлен с использованием методов метода получения. Таким образом, в методе setter будет запущена функция seperateDateObject, которая выполняет некоторую логику для обновления диаграммы.

@api
get allDateRecords() {
    return this._allDateRecords;
}

set allDateRecords(value) {
    this._allDateRecords = value;
    this.separateDateObject();
}
0
ответ дан Brian 5 March 2019 в 18:48
поделиться
Другие вопросы по тегам:

Похожие вопросы: