Mobile首页瀑布流（30）

最新推荐文章于 2022-04-14 13:15:00 发布

骚人文客

最新推荐文章于 2022-04-14 13:15:00 发布

阅读量272

点赞数

分类专栏：做题 web web学习文章标签： vue web

本文链接：https://blog.csdn.net/saorenwenke/article/details/110323606

版权

本文详细介绍了如何在移动端构建一个瀑布流布局的首页，重点讨论了使用Vue.js进行前端开发的技术和实践。

摘要由CSDN通过智能技术生成

Mobile首页瀑布流（30）

<template>
  <div>
    <van-search
      placeholder="请输入你想要搜索的内容"
      show-action
      v-model="value"
    >
      <div slot="action" @click="$router.push('/samsara/search/' + value)">
        搜索
      </div>
    </van-search>

    <div
      class="main"
      infinite-scroll-disabled="loading"
      infinite-scroll-distance="10"
      v-infinite-scroll="more"
    >
      <div class="col">
        <div
          class="item"
          @click="nav(item.id)"
          v-for="(item, index) in img1"
          :key="index"
        >
          <img
            :src="
              $api.BASE_SERVER_URL + item.attachment_rows_data[0].attachmentPath
            "
               //img宽度需要100% 不然变形