uni-app 有没有大佬分享一个电影或者小说的模板

当然可以分享一个简单的uni-app电影详情页模板。这个模板包括电影的基本信息展示和评论列表展示。你可以根据需要进一步扩展和完善。

首先，确保你已经安装并配置好了uni-app的开发环境。然后，你可以按照以下步骤创建一个电影详情页模板。

1. 创建项目结构

在你的uni-app项目中，创建一个新的页面，比如pages/movieDetail/movieDetail.vue。

2. 编写movieDetail.vue

<template>
  <view class="container">
    <view class="movie-info">
      <image class="poster" :src="movie.poster" mode="aspectFill"></image>
      <view class="info">
        <text class="title">{{ movie.title }}</text>
        <text class="rating">{{ movie.rating }}分</text>
        <text class="director">导演：{{ movie.director }}</text>
        <text class="genre">类型：{{ movie.genre }}</text>
        <text class="summary">{{ movie.summary }}</text>
      </view>
    </view>
    <view class="comments">
      <block v-for="(comment, index) in movie.comments" :key="index">
        <view class="comment">
          <text class="user">{{ comment.user }}</text>
          <text class="content">{{ comment.content }}</text>
        </view>
      </block>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      movie: {
        title: '电影标题',
        poster: 'https://example.com/poster.jpg',
        rating: 8.5,
        director: '导演姓名',
        genre: '科幻/动作',
        summary: '电影简介内容...',
        comments: [
          { user: '用户1', content: '评论内容1' },
          { user: '用户2', content: '评论内容2' },
        ],
      },
    };
  },
};
</script>

<style scoped>
.container {
  padding: 20px;
}
.movie-info {
  display: flex;
  margin-bottom: 20px;
}
.poster {
  width: 100px;
  height: 150px;
  margin-right: 20px;
}
.info {
  flex: 1;
}
.title {
  font-size: 24px;
  font-weight: bold;
}
.rating, .director, .genre {
  margin-top: 10px;
}
.summary {
  margin-top: 20px;
}
.comments {
  margin-top: 20px;
}
.comment {
  margin-bottom: 10px;
}
.user {
  font-weight: bold;
}
</style>

3. 使用页面

在你的pages.json中配置这个新页面，确保它能够被正确访问。

{
  "pages": [
    {
      "path": "pages/movieDetail/movieDetail",
      "style": {
        "navigationBarTitleText": "电影详情"
      }
    }
    // 其他页面配置...
  ]
}

这个模板展示了电影的基本信息和评论列表。你可以根据实际需求，从服务器获取电影数据和评论数据，并动态更新到页面上。希望这个模板对你有所帮助！