How do I define a `ref` for dynamically created Comboboxes

I am an old programmer but new to javascript. I am working on a small E-Commerce app. My products or items have up to twenty custom user defined properties. For instance, the category "screws" had two custom properties "Length" and "Thread".

I dynamically create a Combobox filter for each active custom property. I have added a button that I need to reset all dynamically created Combobox filters back to "Any" when clicked.

If my Comboboxes were statically defined, this is the basic idea I am trying to implement:

import React from 'react';
import Combobox from "react-widgets/Combobox";

class Sample extends React.Component {
    constructor() {
        super();
        this.combo1 = React.createRef();
        this.combo2 = React.createRef();
    }    

    render() {
        let buttonClick = () => {
            this.combo1.current.value = "Any";
            this.combo2.current.value = "Any";
        }

        return (
            <div>
                <button onClick={() => buttonClick() }>Reset Filters</button>
                <Combobox data={["Any", "1 1/2", "1 1/4"]} ref={this.combo1} />
                <Combobox data={["Any", "Red", "Green", "Blue"]} ref={this.combo2} />
            </div>
        );
    }
}
export default Sample;

How do I define a ref for dynamically created Comboboxes?

Relevant section from my component:

...
<p style=>Filters:</p>                   
<button>Reset Filters</button>                            
{this.state.filters !== [] ? this.state.filters.map(filter => 
    <div>
        <p style=>{filter.name}</p>
        <Combobox defaultValue="Any" data={filter.values} onChange={(e) => filterChanged(e, filter.property) } />
    </div>) : null}
...                        

I am sure I made quite a few errors. I welcome any constructive criticism.

from How do I define a `ref` for dynamically created Comboboxes