uni-app二次开发:一个影视uni-app加功能

发布于 1周前 作者 bupafengyu 来自 Uni-App

uni-app二次开发:一个影视uni-app加功能

5 回复

免费做行不行


愿意的话可以

回复 1***@qq.com: 别人给你开玩笑的你当真了

也是逗,突然想起了 有个出3k想做原生滴滴打车的。

针对您的uni-app二次开发需求,假设您希望在一个现有的影视uni-app中添加新功能,以下是一个简单的代码示例,展示如何增加一个“收藏影片”的功能。这个功能允许用户点击按钮将影片添加到收藏夹,并在收藏夹页面中查看已收藏的影片。

1. 修改影片详情页面

在影片详情页面(假设为pages/movieDetail/movieDetail.vue),增加一个收藏按钮并绑定点击事件:

<template>
  <view>
    <!-- 其他影片详情内容 -->
    <button @click="addToFavorites(movieId)">收藏</button>
  </view>
</template>

<script>
export default {
  methods: {
    async addToFavorites(movieId) {
      const res = await uni.setStorageSync({
        key: 'favorites',
        value: [...this.getFavorites(), movieId]
      });
      uni.showToast({
        title: '收藏成功',
        icon: 'success'
      });
    },
    getFavorites() {
      const favorites = uni.getStorageSync({
        key: 'favorites',
        default: []
      }).data;
      return favorites;
    }
  }
}
</script>

2. 创建收藏夹页面

创建一个新的页面(假设为pages/favorites/favorites.vue),用于展示已收藏的影片:

<template>
  <view>
    <block v-for="movieId in favorites" :key="movieId">
      <!-- 展示影片信息,假设有获取影片详情的函数getMovieDetail -->
      <view>{{ getMovieDetail(movieId).title }}</view>
    </block>
  </view>
</template>

<script>
export default {
  data() {
    return {
      favorites: []
    };
  },
  onLoad() {
    this.favorites = this.getFavorites();
  },
  methods: {
    getFavorites() {
      return uni.getStorageSync({
        key: 'favorites',
        default: []
      }).data;
    },
    getMovieDetail(movieId) {
      // 假设有一个API或本地数据可以获取影片详情
      const mockMovies = [
        { id: 1, title: '电影A' },
        { id: 2, title: '电影B' }
        // 更多影片...
      ];
      return mockMovies.find(movie => movie.id === movieId);
    }
  }
}
</script>

3. 注意事项

  • 以上代码为简化示例,实际开发中需要考虑数据持久化、API请求、错误处理等。
  • 收藏按钮的样式可以根据项目需求进行自定义。
  • 收藏夹页面可能需要分页加载、搜索等功能,这些都可以根据实际需求进行扩展。
  • 请确保在pages.json中正确配置新页面路径。

以上代码提供了一个基础的收藏功能实现,您可以根据具体需求进行进一步的开发和优化。

回到顶部