0

I have an issue that when I modify my object, my HTML doesn't rerender I'm using empApi and my apex class is working fine, the problem here is to rerender HTML:

<template>
    <div class = "container">
        <template if:true={listaVO}>
            <template for:each={listaVO} for:item="v">
                <c-leilao-Card-Lwc
                    key = {v.maiorValor}
                    listao = {v}
                ></c-leilao-Card-Lwc>
             </template>
        </template>
    </div>
</template>

JS:

    import { LightningElement, wire, api, track } from 'lwc';
    import getVO from '@salesforce/apex/LeilaoLwcLogic.getVO';
    import { subscribe, unsubscribe, onError, setDebugFlag, isEmpEnabled } from 'lightning/empApi';
    import Id from '@salesforce/user/Id';
    import { refreshApex } from '@salesforce/apex';
    var capeta;
    var userId = Id;
    export default class LeilaoLwc extends LightningElement {
        @track listaVO;
        @track error;
       
        @api channelName = '/event/Lance_Veiculo__e';
        subscription = {};

        connectedCallback() {       
            getVO()
                .then(result => {
                    this.listaVO = result;
                    capeta = result;
                })
                .catch(error => {
                    this.error = error;
                }); 
            this.handleSubscribe();       
        }
handleSubscribe() {

        var messageCallback = function(response) {
            var obj = JSON.parse(JSON.stringify(response));
            var novoVencedor = obj.data.payload.novoVencedor__c;

            //Here I use global variable "capeta" because of if I try to use this.listaVO, it shows undefined
            var lst2 = JSON.parse(JSON.stringify(capeta));
            lst2.forEach(el =>{
                if (el.veiculoVO.Id == obj.data.payload.Veiculo__c){

                //Check if winning user is actual user
                        if (novoVencedor !=userId){  
                            el.maiorValor = obj.data.payload.Valor_Lance__c;
                            el.numLance = obj.data.payload.Numero_Lances__c;
                }
                else{
                    //
                }
            }
        }
                );
                this.listaVO = lst2; //HERE I PASS THE VALUE TO listaVO BUT IT DOESNT SHOW IN HTML

Child Component HTML:

<p<lightning-formatted-number value ={listao.maiorValor} ></lightning-formatted-number></p>
<p>Número de lances: <lightning-formatted-number value ={listao.numLance}></lightning-formatted-number</p>

Child Component JS:

@track _listao;
    @api carrolist;
    @api
    get listao(){
        return this._listao;
    }
    set listao(value){
        this.setAttribute('listao',value);
        this._listao = value;
    }
0

i've solved the problem after I saw this topic: LWC property is not reactive The problem was with JavaScript, "this" wasn't referencing to my variable

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.