如何在点击执行函数前显示LGButton的加载微调器？

在点击执行函数前显示LGButton的加载微调器，可以通过以下步骤实现：

首先，确保你已经引入了LGButton的相关库和样式文件，以便在页面中使用该按钮。
在HTML文件中，创建一个LGButton的元素，并为其添加一个唯一的ID，例如：

<button id="lg-button" class="lg-button">执行函数</button>

在CSS文件中，定义LGButton的样式，包括加载微调器的样式，例如：

.lg-button {
  position: relative;
}

.lg-button:after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 20px;
  height: 20px;
  border: 2px solid #000;
  border-top-color: transparent;
  border-radius: 50%;
  animation: spin 1s infinite linear;
}

@keyframes spin {
  0% {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  100% {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}

在JavaScript文件中，使用事件监听器来监听LGButton的点击事件，并在点击事件触发时显示加载微调器，例如：

document.getElementById("lg-button").addEventListener("click", function() {
  showLoader();
  executeFunction();
});

function showLoader() {
  var button = document.getElementById("lg-button");
  button.classList.add("loading");
  button.disabled = true;
}

function executeFunction() {
  // 执行你的函数代码
  // 在函数执行完成后，记得隐藏加载微调器
  hideLoader();
}

function hideLoader() {
  var button = document.getElementById("lg-button");
  button.classList.remove("loading");
  button.disabled = false;
}