esri-leaflet 、dynamicMapLayer、L.control.sideBySide、Vue

[defineconst]

import Vue from "vue";
import Leaflet from "leaflet";
var esri = require("esri-leaflet");
var sideBySide = require("leaflet-side-by-side");
addDynaLayerESRI(url, opacity) {
var envLayer = esri.dynamicMapLayer({
url: url,
opacity: opacity
});
envLayer.addTo(this.map);
return envLayer;
}
this.leftLayer = this.addDynaLayerESRI(this.url1, 1);
this.rightLayer = this.addDynaLayerESRI(this.url2, 1);
this.sideControl = L.control
.sideBySide([this.leftLayer], [this.rightLayer])
.addTo(this.map);

it throws exption as：
vue.esm.js?efeb:610 [Vue warn]: Error in mounted hook: "TypeError: this._leftLayer.getContainer is not a function" found in

vue.esm.js?efeb:1841 TypeError: this._leftLayer.getContainer is not a function
at NewClass._updateClip (index.js?606c:135)
at NewClass._updateLayers (index.js?606c:167)
at NewClass.addTo (index.js?606c:89)