app-AgricultureSmart/uniapp/pages/index/index.vue

<template>
<!--	<view class="content">-->
<!--		<image class="logo" src="/static/logo.png"></image>-->
<!--		<view class="text-area">-->
<!--			<text class="title">{{title}}</text>-->
<!--		</view>-->
<!--    <button @click="test">测试按钮</button>-->

<!--    <van-button type="primary">van的button</van-button>-->
<!--	</view>-->




  <view class="content">
    <van-search
        :value="value"
        placeholder="请输入搜索关键词"
        @search="onSearch"
        @cancel="onCancel"
        @change="onChange"
        @click="gotoSearch"
    />
    <!-- show-action -->
    <!-- 		<scroll-view scroll-x="true">
          <view>1</view>
        </scroll-view> -->


    <!-- <view class="uni-margin-wrap">
           <swiper :autoplay="true">
             <swiper-item item-id="A">
               <view class="swiper-item uni-bg-red"><text class="swiper-item-Text">A</text></view>
             </swiper-item>
             <swiper-item item-id="B">
               <view class="swiper-item uni-bg-green"><text class="swiper-item-Text">B</text></view>
             </swiper-item>
             <swiper-item item-id="C">
               <view class="swiper-item uni-bg-blue"><text class="swiper-item-Text">C</text></view>
             </swiper-item>
           </swiper>
         </view> -->

    <!-- 轮播图区域 -->

    <swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000" :circular="true">

      <swiper-item v-for="(item,i) in swiperList"  :key="i">
        <!-- 123 -->
        <navigator class="swiper-item" :url="'/subpkg/goods_detail/goods_detail?goods_id='+item.goods_id">
          <!-- <navigator class="swiper-item"> -->
          <img :src="item.image_src" alt="">
        </navigator>
      </swiper-item>
    </swiper>
    <!-- <image class="logo" src="/static/logo.png"></image>
    <view class="text-area">
      <text class="title">{{title}}</text>
    </view> -->
    <!-- 123 -->
    <my-grid></my-grid>
  </view>
</template>

<script >
console.log(uni.$http)
	export default {
		data() {
			return {
        title: 'Hello',
        value:"",
        //这是轮播图的数据列表
        swiperList:[{goods_id: 123,
          image_src: "../../static/logo.png",
          goods_name: "string"},{goods_id: 124,
          image_src: "../../static/logo.png",
          goods_name: "string"},{goods_id: 125,
          image_src: "../../static/logo.png",
          goods_name: "string"}],
			}
		},
		onLoad() {

		},
		methods: {
      test() {
        console.log(1, "test");
      },
      onSearch() {
        console.log('查询了');
      },

      onCancel(){
        console.log('取消了');
      },
      gotoSearch(){
        console.log('去了');
        uni.navigateTo({
          url:"/subpkg/search/search"
        })
      },
      onChange(){
        console.log('修改了');
      }
		},
	}
</script>

<style lang="scss">
  swiper{
    height: 330rpx;
    width: 95%;
    .swiper-item,
    image{
      width: 100%;
      height: 100%;
    }
  }
  .content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .logo {
    height: 200rpx;
    width: 200rpx;
    margin-top: 200rpx;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 50rpx;
  }

  .text-area {
    display: flex;
    justify-content: center;
  }

  .title {
    font-size: 36rpx;
    color: #8f8f94;
  }

</style>