Render react-router <Link> inside google Inf

Question

So my application requires a link to be included in Google's InfoWindow, however, the infoWindow's content only accepts a string. For the life of me, I can't figure out how to pass a <Link> into content. My component is set up like

import React, { Component } from 'react';
import { connect } from 'react-redux';
import { fetchWells } from '../actions/index';
import { Link } from 'react-router'

class Map extends Component {
  constructor(props) {
    super(props);
  }
  componentDidMount() {
    const markers = [];
    this.props.fetchWells();
    const map = new google.maps.Map(this.refs.map, {
      zoom: 7,
      center: {
        lat: this.props.route.lat,
        lng: this.props.route.lng
      }
    });
    this.setState( { map })
  };

  renderMarkerContent(id) {
    return <Link to={`wells/${id}`}>Link</Link>;
  }

  componentWillReceiveProps(nextProps) {
    const markers = [];
    console.log(nextProps.wells)
    nextProps.wells.forEach((well) => {
      if (well.location === null) return;
      console.log(well)
      const marker = new google.maps.Marker({
        position: { lat: well.location.coordinates[0], lng: well.location.coordinates[1]},
        map: this.state.map
      });
      const infoWindow = new google.maps.InfoWindow({
        content: this.renderMarkerContent(),
      });
      marker.addListener('click', () => {
        infoWindow.open(map, marker)
      });
      markers.push(marker)
    })
  }

I'm pretty new to React, so I feel like there is a way to maybe Render the content as a separate component maybe? Or somehow render the <Link> tag and stringify it. Any clues?

EDIT

So I've gotten the links to render using by passing a function that returns the <Link>

renderMarkerContent(id) {
    return ReactDOMServer.renderToString(<Link to={`wells/${id}`}>Well Page</Link>)
}

Not sure if this is the best solution, but it doesn't fully render and gives me an <a> element without the href.