I am trying to pass the selected value of a <select> in the onChange function. I have tried this SO Question, but this and this.value don't work. I know the question is kinda old...

setShippingMethod(obj) {
    console.log('Shipping method ' + JSON.stringify(obj));
    this.state.defaultMethod = obj.value;
    this.props.setShippingMethod(obj.value);
}

render() {
    const shippingMethods = this.state.shippingMethods;
    const defaultMethod = this.state.defaultMethod;        

    return (
        <aside id="checkout" className="block col-1">
            <h1>Shipping</h1>
            <div className="row">
                <select id="comboMethod" onChange={setShippingMethod(this)} value={!!defaultMethod ? null : defaultMethod.trim()}>
                    {shippingMethods.map(method => { return <option key={method.shipmthd.trim()} value={method.shipmthd.trim()}>{method.shipmthd.trim()}</option>} )}
                </select>
            </div>
        </aside>
    );
}

My line console.log('Shipping method ' + JSON.stringify(obj)) generates an error "Uncaught TypeError: cyclic object value" and the message seems to be this still refers to the entire (in my case) modal. Is there a newer way to do this? Any help will be appreciated.