如何实现点击按钮动态修改地图的dragging配置选项？

你调用invalidateSize()没用是因为这个方法是用来重新计算地图容器尺寸的（比如窗口缩放后适配），和拖拽配置完全不相关。要动态修改地图的拖拽状态，直接操作Leaflet地图实例的dragging处理器就行：

• 启用拖拽：调用 map.dragging.enable()
• 禁用拖拽：调用 map.dragging.disable()

给你个完整的示例代码：

<!-- HTML按钮 -->
<button id="toggleDragBtn">启用拖拽</button>
<div id="map" style="width: 800px; height: 500px;"></div>

<script>
// 初始化地图，初始禁用拖拽
const map = L.map('map', { dragging: false }).setView([39.9042, 116.4074], 11);

// 添加瓦片图层（示例用OpenStreetMap）
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
  attribution: '&copy; OpenStreetMap contributors'
}).addTo(map);

// 绑定按钮点击事件，切换拖拽状态
const toggleBtn = document.getElementById('toggleDragBtn');
toggleBtn.addEventListener('click', function() {
  if (map.dragging.enabled()) {
    map.dragging.disable();
    this.textContent = '启用拖拽';
  } else {
    map.dragging.enable();
    this.textContent = '禁用拖拽';
  }
});
</script>

核心逻辑就是通过dragging处理器的enable()/disable()方法直接切换状态，不用去修改初始化时的配置项——因为初始化配置只在地图创建时生效，后续修改配置对象不会影响已创建的地图实例。

内容的提问来源于stack exchange，提问作者DEVX