Store multiple html elements in variable with React

Your ideal approach seems like a great way to compose the final <address> element. You can achieve this using Fragments as the issue/error would be around base's contents in renderAddress(event) would need to be wrapped with some element to avoid errors attempting to render values such as {event.venue.address.address_1}. A React.Fragment would allow you to render base while avoiding introducing additional rendered wrapper elements:

const renderAddress = event => {
  const base = (
    <React.Fragment>
      {event.venue.address.address_1}
      < br />
      {event.venue.address.city}
      < br />
      {event.venue.address.postal_code}
    </React.Fragment>
  );

  if (event.venue.address.address_2) {
    return (
      <address>
        {event.venue.address.address_2}
        <br />
        {base}
      </address>
    );
  } else {
    return (
      <address>
        {base}
      </address>
    );
  }
};

Here is a basic example in action.

Note: React.Fragment is only available with React version 16.2+.