tpl_flex_five.vue 670 B

12345678910111213141516171819202122232425262728293031
  1. <template>
  2. <div class="layout">
  3. <u-image width="140rpx" mode="aspectFit" height="140rpx" @click="modelNavigateTo(item)" class="image-mode" v-for="(item,index) in res.list" :key="index" :src="item.img" alt="">
  4. <u-loading slot="loading"></u-loading>
  5. </u-image>
  6. </div>
  7. </template>
  8. <script>
  9. import { modelNavigateTo } from "./tpl";
  10. export default {
  11. title: "五列单行图片模块",
  12. props: ["res"],
  13. data() {
  14. return {
  15. modelNavigateTo,
  16. };
  17. },
  18. mounted() {},
  19. };
  20. </script>
  21. <style lang="scss" scoped>
  22. @import "./tpl.scss";
  23. .layout {
  24. display: flex;
  25. align-items: center;
  26. justify-content: center;
  27. background-size: cover;
  28. }
  29. </style>