更新记录

0.0.1（2024-12-05） 下载此版本

• 首次发布插件版本，实现了本地图片和视频的选择，删除功能。采用9宫格的布局方式，点击图片可查看大图，点击视频可直接播放。

平台兼容性

huaqiang-media-grid 媒体文件选择

组件名：huaqiang-media-grid

本地图片和视频的选择，删除功能。采用9宫格的布局方式，点击图片可查看大图，点击视频可直接播放。 使用示例：

<template>
  <view class="index-container">
    <view class="title">媒体选择示例</view>

    <!-- 使用媒体选择组件 -->
    <huaqiang-media-grid 
      v-model="mediaList"
      :maxCount="6"
      @change="handleMediaChange"
    ></huaqiang-media-grid>

    <!-- 展示已选择的媒体数量 -->
    <view class="tips">
      已选择 {{ mediaList.length }} 个文件（最多可选6个）
    </view>

    <!-- 提交按钮 -->
    <button 
      class="submit-btn" 
      type="primary" 
      @tap="handleSubmit"
      v-if="mediaList.length > 0"
    >
      确认提交
    </button>
  </view>
</template>

<script>

export default {
  components: {
  },
  data() {
    return {
      mediaList: []
    }
  },
  methods: {
    handleMediaChange(list) {
      console.log('媒体列表变化：', list)
    },
    handleSubmit() {
      // 处理提交逻辑
      console.log('提交的媒体列表：', this.mediaList)
      uni.showToast({
        title: '提交成功',
        icon: 'success'
      })
    }
  }
}
</script>

<style scoped>
.index-container {
  padding: 40rpx;
}

.title {
  font-size: 36rpx;
  font-weight: bold;
  text-align: center;
  margin-bottom: 60rpx;
}

.tips {
  font-size: 28rpx;
  color: #666;
  text-align: center;
  margin-top: 40rpx;
}

.submit-btn {
  margin: 40rpx auto;
  width: 80%;
}
</style>