How Can I Chain Functions Together In React

I'd like to chain the two functions used below together to improve the experience of our mobile users. First the updateSelectedValue function should be called, then the handleAddToCart function. The below code works for desktop users, but not for mobile users:

<span
  className="optionValue"
  key={optionValue}
  onClick={this.handleAddToCart}
  onMouseEnter={() => this.props.updateSelectedValue(optionValue)}
>
   {optionValue} 
</span>

You could handle both functions in the onClick event:

<span
  className="optionValue"
  key={optionValue}
  onClick={() => {
    this.props.updateSelectedValue(optionValue);
    this.handleAddToCart();
  }}
>
  {optionValue}
</span>