你遇到的滑动后出现大量空白且持续扩大的问题，核心是Swiper初始化时机与动态DOM更新不匹配，再加上缺少关键配置参数，导致Swiper无法正确计算滑块容器的边界：

1. 初始化时DOM未完全渲染：虽然你在Ajax的complete回调里初始化Swiper，但complete仅表示请求完成，此时通过append添加的slide元素可能还没完全渲染到DOM中，Swiper无法准确识别slide的数量和尺寸，边界计算直接出错。
2. 缺少关键配置参数：你的Swiper初始化只设置了spaceBetween，没指定slidesPerView（每屏显示的slide数量），动态加载场景下Swiper自动计算容易出现偏差，进而允许超出实际slide范围的滑动，空白区域也就随之产生并扩大。

按照以下步骤修改代码就能解决问题：

1. 调整初始化时机，确保DOM完全就绪 #

把Swiper的初始化移到success回调的末尾，确保所有slide都添加到DOM后再初始化：

// 以第一个滑块为例
$.ajax({
  type: "POST",
  url: ajaxurl3,
  success: function(data) {
    $.each(data, function(i, field){
      // 你的slide拼接代码
      $("#slider-ementa-home").append(string);
    });
    // 所有slide添加完成后立即初始化Swiper
    var mySwiper2 = myApp.swiper('.swiper-ementa-home', {
      spaceBetween: 15,
      slidesPerView: 'auto', // 关键：让Swiper自动适配每屏显示数量
      resistanceRatio: 0,    // 禁止超出边界的弹性滑动，避免空白扩大
    });
  }
});

2. 补充必要的配置参数 #

初始化Swiper时添加这两个核心参数：

• slidesPerView: 'auto'：让Swiper根据slide宽度自动计算每屏显示数量，完美适配动态加载的内容。
• resistanceRatio: 0：彻底关闭超出边界时的弹性滑动效果，从根源阻止滑动到空白区域。

3. 手动触发布局更新（可选） #

如果还是偶尔出现问题，可以在初始化后手动调用update()方法，强制Swiper重新计算布局：

mySwiper2.update();

myApp.onPageInit('home', function (page) {
  // 无需嵌套$(document).ready()，Framework7的onPageInit已确保页面DOM就绪
  var ajaxurl3="myurl.php";
  $.ajax({
    type: "POST",
    url: ajaxurl3,
    success: function(data) {
      $.each(data, function(i, field){
        var id=field.id_categoria;
        var nomeCategoria=field.nome_categoria;
        var imgCategoria=field.img_categoria;
        var string = "<div class='swiper-slide' style='background-image:url(https://pizzarte.com/app/img/ementa/"+imgCategoria+")'><a href='pratos.html?idcat="+id+"&cat="+nomeCategoria+"'><p>"+nomeCategoria+"</p></a></div>";
        $("#slider-ementa-home").append(string);
      });
      // 初始化第一个Swiper
      var mySwiper2 = myApp.swiper('.swiper-ementa-home', {
        spaceBetween: 15,
        slidesPerView: 'auto',
        resistanceRatio: 0
      });
    }
  });

  var ajaxurl4="myurl2.php";
  $.ajax({
    type: "POST",
    url: ajaxurl4,
    success: function(data) {
      $.each(data, function(i, field){
        var id=field.id_evento;
        var nomeEvento=field.nome_evento;
        var imgEvento=field.img_evento;
        var string = "<div class='swiper-slide' style='background-image:url(https://pizzarte.com/app/img/eventos/"+imgEvento+")'><a href='eventos.html?idcat="+id+"&cat="+nomeEvento+"'><p>"+nomeEvento+"</p></a></div>";
        $("#slider-eventos-home").append(string);
      });
      // 初始化第二个Swiper
      var mySwiper3 = myApp.swiper('.swiper-eventos-home', {
        spaceBetween: 15,
        slidesPerView: 'auto',
        resistanceRatio: 0
      });
    }
  });
});

小提示：Framework7的onPageInit已经保证页面DOM加载完成，所以没必要嵌套$(document).ready()，去掉它还能避免不必要的DOM就绪等待。

内容的提问来源于stack exchange，提问作者Eduardo João