uniapp的swiper-item可视页面上横向展示了两张图，并且数据页只有两个图片给:first-child图加个右边距22rpx，但是一滚动位置发生了变换原来的一图变成了二图原来的二图变成了一图，实现不管怎样左右切换图片他门中间始终有个22rpx的间距

在 UniApp 的 Swiper 组件中，要保持滑动时 `.swiper-item` 中的两张图片始终保持一个固定的22rpx间距，你需要在 CSS 中设置一个相对定位（position: relative），并且为第一张图片添加一个绝对定位（position: absolute）。同时，你可以利用 `:nth-child(2)` 或 `:last-child` 来指定第二个（即原本显示第二张图片的位置）的样式。当滑动时，通过 JavaScript 监听滑动事件，动态更改图片的位置并调整它们之间的 margin。

以下是基本的 CSS 部分：

.swiper-container .swiper-item {
  position: relative;
}

.swiper-item .image-first {
  position: absolute;
  right: -22rpx;
}

.swiper-item:nth-child(2), .swiper-item .image-second {
  margin-right: 22rpx;
}

JavaScript 部分（使用 Vue.js 示例）:

export default {
  data() {
    return {
      activeIndex: 0,
    };
  },
  mounted() {
    this.updateImageMargin();
  },
  methods: {
    handleSwipeChange(index) {
      this.activeIndex = index;
      this.updateImageMargin();
    },
    updateImageMargin() {
      let imageFirstClass = '.swiper-item .image-first';
      let imageSecondClass = '.swiper-item:nth-child(2)';

      document.querySelector(imageFirstClass).style.right = (this.activeIndex === 0) ? '-22rpx' : '0';
      document.querySelector(imageSecondClass).style.marginRight = (this.activeIndex === 0) ? '0' : '22rpx';
    },
  },
};

请注意，这里假设 `.image-first` 和 `.image-second` 分别代表了两张图片的类名。根据实际项目结构调整相应的选择器。