onChange has undefined event

[RobinShift4]

Within this code

`{dashboardFilters?.map((filter) => {

          return (

            <DashFilters 

              filter={filter || {}}

              expression={filterValues[filter.name] || filter.default_value}

              onChange={(event) => handleFilterChange(event, filter.name)}

              key={filter.id}

              token={currentDashboard.token}

            />

          );

        })}`

my event is always undefined (and thus I cannot use the value of the component in the function). Any idea as to why?

[mdodgelooker]

Hi @RobinShift4 DashFilters is not one of our components. Would you be able to provide a repro on codesandbox or similar or provide the code for your DashFilters component?

[RobinShift4]

@mdodgelooker it's based on what is defined here:

https://github.com/looker-open-source/LookerEmbedReference/blob/main/Frontend/src/components/EmbedDashboardWFilters/EmbedDashboardWFilters.js

[mdodgelooker]

Hi @RobinShift4 it could have something to do with how React state is being used. I've created a simpler example using our DashboardFilter component from the @looker/filter-components package. It's an easier-to-use option than DashFilters from the example you used above. Let me know if it's helpful: https://codesandbox.io/p/sandbox/jovial-gould-forked-rzh8y5

Docs for DashboardFilter component: https://looker-open-source.github.io/components/latest/?path=/docs/filters-docs-dashboardfilter--docs

[RobinShift4]

@mdodgelooker thanks - I was able to get that to work though I am not sure what was going wrong earlier.

[mdodgelooker]

@RobinShift4 that's great!