null/pages/mang/components/zetank-notice.vue

<template>
	<view class="notice">
		<view class="right_notice">
		  <swiper class="notice_swiper" vertical easing-function="easeInOutCubic" :circular="true" :autoplay="true" :interval="interval">
			<swiper-item v-for="(item,index) in noticeList" :key="index" class="sw_item" @click="clickNotice(item)">
			   <text class="sw_text clamp">{{item.title}}</text>
			</swiper-item>
		  </swiper>
		</view>
	</view>
</template>

<script>
export default {
  data() {
    return {};
  },
  props: {
	noticeList:{
	  type:Array,
	  default(){
		  return [{id:0,title:"暂无"}]
	  }
	},
	interval:{
		type:Number,
		default:5000
	},
  },
  methods: {
	  clickNotice(e){
		  this.$emit('clickNotice',e)
	  }
  }
};
</script>
<style lang="scss" scoped>
.notice{
  height: 64upx;
  line-height: 64upx;
  margin: 0 3%;
  // margin-top: 15upx;
  padding: 0 10upx;
  // box-shadow: 0upx 0upx 10upx #eee;
  // border-radius: 8upx;
}
.right_notice{
  float: left;
  width: 100%;
}
.right_notice .notice_swiper{
  height: 64upx;
}
.notice_swiper .sw_item{
  height: 64upx;
}
.notice_swiper .sw_item .sw_text{
  font-size: 24upx;
  color: #333;
  display: inline-block;
  line-height: 64rpx;
  max-width: 480rpx;
}
</style>