uniapp轮播图指示点换成图片

可以通过设置 indicator-dots 属性为 false，然后在 swiper-item 中添加自定义的图片来实现。具体代码如下：

<swiper indicator-dots="false">
<swiper-item>
<image src="图片路径"></image>
</swiper-item>
<swiper-item>
<image src="图片路径"></image>
</swiper-item>
</swiper>

相关问题

uniapp轮播图怎么设置，指示点要修改成长条形

你可以使用 uni-swiper 组件来创建轮播图。首先，确保你已经安装了 `@dcloudio/uni-ui` 插件。

然后，在你的页面中，使用 `<uni-swiper>` 标签来包裹轮播图的内容。例如：

<template>
  <view>
    <uni-swiper :indicator-dots="false" :indicator-style="indicatorStyle">
      <uni-swiper-item>
        <image src="图片1"></image>
      </uni-swiper-item>
      <uni-swiper-item>
        <image src="图片2"></image>
      </uni-swiper-item>
      <uni-swiper-item>
        <image src="图片3"></image>
      </uni-swiper-item>
    </uni-swiper>
  </view>
</template>

<script>
export default {
  data() {
    return {
      indicatorStyle: {
        height: '4px',
        backgroundColor: '#000000',
        borderRadius: '2px',
      },
    };
  },
};
</script>

在上面的示例中，我们通过设置 `indicator-dots` 属性为 `false` 来隐藏指示点。然后，通过设置 `indicator-style` 属性来修改指示点样式为长条形。在 `indicatorStyle` 数据中，我们设置了指示点的高度、背景颜色和圆角。

你可以根据需要调整 `indicatorStyle` 中的样式属性来满足你的需求。希望这能帮到你！

uniapp轮播图加载大量图片优化

在使用uniapp进行轮播图加载大量图片时，可以采取以下优化措施：
1. 使用延迟加载：通过设置图片的data-src属性，将图片链接存储在data-src中，等到图片需要展示时，再将data-src中的链接赋值给src属性，这样可以减少页面打开时同时加载大量图片的负荷。
2. 图片压缩：对于图片文件可以进行压缩处理，减小图片文件的大小，从而提高图片的加载速度。
3. 预加载：在页面加载完成后，提前加载轮播图需要用到的图片，这样可以在切换轮播图时减少图片的加载时间。
4. 资源合并：将多个小的图片文件合并成一个大的图片文件，减少HTTP请求数量，提高页面的加载速度。