JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<link rel="stylesheet" href="//stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"></script>
<script src="//stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<a tabindex="0" 
  class="btn btn-lg btn-danger" 
  role="button" 
 >
  Show popover
</a>

CSS

a{
  margin: 40px;
}

JavaScript

$(function () {
    $('[data-toggle="popover"]').popover();

		async function getData(){
    	var resultFetch = await fetch('https://jsonplaceholder.typicode.com/todos/1');
      console.log("resultFetch", resultFetch);
      return resultFetch;
    }
    
    $('a').popover({
        content: function(){
            var result = getData();            
            return result;

        }
    });
});