[Solved]-Is this the correct way to show data in React from a fetch request, if not how do I change JSX being rendered to a component?-Reactjs

Ya I would make a component (or a function if that seems more appropriate) to render an individual coin.

You could make a <Coin> component and pass the needed data to it as props:

render() {
  return (
    <div className='purse'>
      {this.state.lists.map((coin, index) => <Coin data={coin} index={index} key={coin.CoinInfo.Id} />)}
    </div>
  );
}

Or just move the rendering of a coin to a new function:

renderCoin(coin, index) {
  return <ul className='coin-containers' key={coin.CoinInfo.Id}>
    <li><img className='coinImages' src={`${API_BASE_IMAGE}${coin.CoinInfo.ImageUrl}`} alt={coin.CoinInfo.FullName}/>
    </li>
    <li>{index + 1}</li>
    <li>{coin.CoinInfo.FullName}</li>
    <li className='ticker'>{coin.CoinInfo.Name}</li>
    <li>{coin.DISPLAY.USD.PRICE}</li>
    <li>{coin.DISPLAY.USD.SUPPLY}</li>
    <li>{coin.DISPLAY.USD.MKTCAP}</li>
    <li>24HR</li>
    <li>{coin.DISPLAY.USD.CHANGEPCT24HOUR}%</li>
  </ul>;
}
render() {
  return (
    <div className='purse'>
      {this.state.lists.map((coin, index) => this.renderCoin(coin, index))}
    </div>
  );
}