OpenLayer 缩放至矢量图层中心

今天搬砖时碰到一个需求，需要利用OpenLayer发布矢量图层，并且缩放至该图层的中心处。

1.问题描述

   var vertorSoure = new VectorSource({
        projection: "EPSG:4326",
        url: "http://localhost:8181/tempGeojson/dongliaohe_border.json", //GeoJSON的文件路径，用户可以根据需求而改变
        format: new GeoJSON(),
      });
      vertorSoure.getExtent()

首先在获取图层边界坐标时，利用getExtent()方法始终获取不到实际图层范围，获取到的坐要么是空，要么是无限大。

2.解决方案

   vertorSoure.on("change", (event) => {
        if (vertorSoure.getState() === "ready") {
          const extent = vertorSoure.getExtent();

          let polygon = new Polygon([
            [
              [extent[0], extent[1]],
              [extent[2], extent[1]],
              [extent[2], extent[3]],
              [extent[0], extent[3]],
              [extent[0], extent[1]],
            ],
          ]);
          _this.map.getView().fit(polygon, { padding: [120, 450, 120, 120] });
        }
      });

后来找资料终于发现得等 vertorSoure加载完才能获取到图层边界。