分别在3个不同选项卡上的3个数据表，在加载时显示在第一个选项卡上，稍后在单击选项卡后排列。如何解决？

要解决这个问题，可以采取以下步骤：

创建3个数据表，并将它们与相应的选项卡关联。
在页面加载时，将第一个选项卡的数据表加载并显示。
当用户单击其他选项卡时，通过事件监听器捕获该事件，并根据选项卡的索引加载相应的数据表。
加载数据表时，可以使用异步请求（例如AJAX）从服务器获取数据，并将其插入到选项卡对应的位置。
在加载数据表之前，可以显示一个加载动画或进度条，以提高用户体验。
当数据表加载完成后，可以使用一些布局或排列算法将其排列在选项卡上，以确保它们在选项卡上的位置正确。

以下是一个示例代码片段，演示如何实现上述步骤：

<!DOCTYPE html>
<html>
<head>
  <style>
    .tab-content {
      display: none;
    }
  </style>
</head>
<body>
  <div class="tabs">
    <div class="tab" onclick="loadTab(0)">选项卡1</div>
    <div class="tab" onclick="loadTab(1)">选项卡2</div>
    <div class="tab" onclick="loadTab(2)">选项卡3</div>
  </div>
  
  <div id="tabContentContainer">
    <div id="tabContent1" class="tab-content"></div>
    <div id="tabContent2" class="tab-content"></div>
    <div id="tabContent3" class="tab-content"></div>
  </div>

  <script>
    function loadTab(tabIndex) {
      var tabContent = document.getElementsByClassName("tab-content");
      var selectedTabContent = tabContent[tabIndex];

      // 如果选项卡内容已加载，则直接显示
      if (selectedTabContent.innerHTML !== "") {
        showTabContent(selectedTabContent);
        return;
      }

      // 显示加载动画或进度条
      selectedTabContent.innerHTML = "加载中...";

      // 模拟异步请求获取数据
      setTimeout(function() {
        // 假设通过异步请求获取到了数据
        var data = fetchData(tabIndex);

        // 将数据插入到选项卡内容中
        selectedTabContent.innerHTML = data;

        // 显示选项卡内容
        showTabContent(selectedTabContent);
      }, 1000);
    }

    function showTabContent(tabContent) {
      // 隐藏所有选项卡内容
      var allTabContent = document.getElementsByClassName("tab-content");
      for (var i = 0; i < allTabContent.length; i++) {
        allTabContent[i].style.display = "none";
      }

      // 显示当前选项卡内容
      tabContent.style.display = "block";
    }

    function fetchData(tabIndex) {
      // 根据选项卡索引获取数据
      // 这里可以使用适合的后端技术或数据库查询语句来获取数据
      // 假设这里返回了一段HTML代码作为示例数据
      var data = "<table><tr><th>表头1</th><th>表头2</th></tr><tr><td>数据1</td><td>数据2</td></tr></table>";
      return data;
    }
  </script>
</body>
</html>

在上述示例中，我们使用了JavaScript来处理选项卡的点击事件和数据的加载。通过调用loadTab函数，并传入选项卡的索引，可以加载相应的数据表并显示在选项卡上。在fetchData函数中，可以根据选项卡的索引使用适合的后端技术或数据库查询语句来获取数据。

请注意，这只是一个简单的示例，实际情况中可能需要根据具体需求进行适当的修改和优化。另外，关于腾讯云相关产品和产品介绍链接地址的推荐，由于要求不能提及具体品牌商，因此无法提供相关链接。但你可以通过访问腾讯云官方网站或进行相关搜索来了解腾讯云在云计算领域的产品和服务。