JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://10125.selcdn.com/devlprs/leaflet/leaflet-src.js"></script>
<link rel="stylesheet" href="http://10125.selcdn.com/devlprs/leaflet/leaflet.css">
<script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
<div id="map"></div>
<br>
on start shown EPSG3857 base layer and EPSG3395 traffic layer
<br><br>
<button class="_gis_btn">set base layer: 2gis (EPSG3857)</button>
<br>
<br>
<button class="_yandex_btn">set base layer: yandex (EPSG3395)</button>
<br>
<br>
<button class="_traffic_btn">set traffic layer: traffic (EPSG3395)</button>

CSS

#map {
  width: 500px;
  height: 300px;
}

JavaScript

// customize some GridLayer methods
L.TileLayerCustomCrs = L.TileLayer.extend({

  _updateLevels: function() {

    var zoom = this._tileZoom,
      maxZoom = this.options.maxZoom;

    if (zoom === undefined) {
      return undefined;
    }

    for (var z in this._levels) {
      if (this._levels[z].el.children.length || z === zoom) {
        this._levels[z].el.style.zIndex = maxZoom - Math.abs(zoom - z);
      } else {
        L.DomUtil.remove(this._levels[z].el);
        this._removeTilesAtZoom(z);
        delete this._levels[z];
      }
    }

    var level = this._levels[zoom],
      map = this._map;

    if (!level) {
      level = this._levels[zoom] = {};

      level.el = L.DomUtil.create('div', 'leaflet-tile-container leaflet-zoom-animated', this._container);
      level.el.style.zIndex = maxZoom;

      level.origin = map.project(map.unproject(map.getPixelOrigin()), zoom).round();

      // custom 
      // calculate crs level for custom crs
      // 
      level.__customCrsLevel = {};

      var a = map._getNewPixelOrigin(
        map.getCenter(),
        undefined,
        this.options.crs
      );

      var b = map.unproject(
        a,
        undefined,
        this.options.crs
      );

      level.__customCrsLevel.origin = map.project(
        b,
        zoom,
        this.options.crs
      ).round();

      // end of custom 

      level.zoom = zoom;

      this._setZoomTransform(level, map.getCenter(), map.getZoom());

      // force the browser to consider the newly added element for transition
      L.Util.falseFn(level.el.offsetWidth);
    }

    this._level = level;

    // custom
    this.__customCrsLevel = level.__customCrsLevel;
    // end of custom

    return level;
  },


  _getTiledPixelBounds: function(center) {

    var map = this._map;

    var crs = (this._hasDifferentCrs) ? this.options.crs : null;

    // custom (add this.options.crs in project method call)
    var pixelCenter = map.project(center, this._tileZoom,...