states = {
    first: true,
    second: false

What I'm trying to achieve:
I want to check if this.states has any true values.

What I've tried

Object.values(this.states).some(v => v === true);

What I've noticed:
I've noticed that: Object.values Object.keys Object.entries always returns for me an empty array, although the states object itself is not empty.

My question is:
What can be the cause? I've seen that @track properties are basically encapsulating object into Proxy object. How can I get all of the values of this.states object?

Okay so it does not seem to work only with my getter which toggles visibility of my div.

get isDivDisplayed() {
    return Object.values(this.states).some((v) => v);
<div if:true={isDivDisplayed}>something</div>
  • This seems to be working, when adding let hasTrue = Object.values(this.states).some(v => v === true); in connectedCallback(), I am able to get hasTrue as true. Could you add more code for us to be able to replicate the issue?
    – Raul
    Sep 9 '21 at 8:35
  • update in description
    – Rechu
    Sep 9 '21 at 9:51
  • That is working as well. Could you share an example on- webcomponents.dev/create/lwc
    – Raul
    Sep 9 '21 at 10:00

It is working fine for me. Check below piece of code:-

import { LightningElement, track } from 'lwc';

export default class Summer21 extends LightningElement {
    @track states = {
        first: true,
        second: false

        console.log(Object.values(this.states).some(v => v === true));
        for (const [key, value] of Object.entries(this.states)) {
            console.log(`${key}: ${value}`);

When i place the component on the page, I see these results:-

enter image description here

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.