el-carousel实现分页_ougexingfuba的博客-程序员信息网_carousel 分页

技术标签: vue  element ui  

<el-carousel :interval="5000" arrow="always" :autoplay="false" height="600px">
    <el-carousel-item v-for="item in Math.ceil(goodsList.length / 4)" :key="item">
        
        <ul class="price-main">
          
          <li v-for="(site,index) in goodsList.slice((item - 1) * 4, item * 4)" 
              :key="site.id"
              v-if="index<=3"
              >
              
                <p>
                  <span class="shortname">{
   {site.shortname}}</span>
                  <span class="label">{
   {site.label}}</span>
                  <span class="label">{
   {site.label1}}</span>
                </p>
                <p>
                  <ol>
                    <li>
                      <p>贴现率(%)</p>
                      <span>{
   {site.price}}</span>

                    </li>
                    <li>
                      <p>预计成交价(元)</p>
                      <span>{
   {site.deal}}</span>
                    </li>
                    <li>
                      <p>每十万扣息(元)</p>
                      <span>{
   {site.discount}}</span>
                    </li>
                  </ol>
                </p>
                <p class="label2">
                  *{
   {site.label2}}
                </p>
                <p class="sqqy-p">
                  <a class="sqqy" href="#">申请签约</a>
                </p>
              
          </li>
        </ul>
      
    </el-carousel-item>
  </el-carousel>

如下图:

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/ougexingfuba/article/details/106993229

智能推荐

iphone12里的计算机,iPhone12来了!性价比超高的11还值得买吗?_这块必被安排的博客-程序员信息网

iPhone12来了!性价比超高的11还值得买吗?2020-09-11 09:34:461点赞0收藏0评论大家好,我是科技君的探讨,欢迎关注我,与我一起进行科技的探讨。iPhone12终于来了!那么iPhone11及前几代iPhone该不该买呢?这个问题很值得回味。毕竟iPhone12作为苹果首款5G手机,可以说是5G时代的先锋,而前几代iPhone只能在5G真正普及之时也该正式脱轨,但是到那时候...

一文拆解中国火星车着陆全过程_人工智能学家的博客-程序员信息网

天问一号着陆器降落火星(艺术图)来源:深城物联经过惊心动魄的九分钟,中国首个火星车祝融号成功穿越火星大气层,着陆于火星北半球的乌托邦平原南端。自此,继苏联和美国之后,中国成为了第三个...

Filter开发_Javens丶的博客-程序员信息网

一、Filter简介       Filter中文名为过滤器,主要功能有:过滤非法文字和信息、设置统一字符编码、对用户进行登录验证、对XML的输出使用XSTL来进行转换。       Filter与Servlet一样,也是一个Java类,自定义的Filter必须实现Filter接口,并实现该接口中的init()、doFilter()和destroy()这三个方法。前两者分别是初始化和销毁的时候调用...

图生成对抗网络_「已注销」的博客-程序员信息网_图生成网络

(1)动机图表示学习,也称为网络嵌入,目的是将图(网络)中的每个顶点表示为低维向量,这有助于对顶点和边缘进行网络分析和预测。学习到的嵌入能够帮助广泛的现实应用程序,如链路预测、节点分类、推荐、可视化、知识图表示等。图表示学习的目的是将图中的每个顶点嵌入到一个低维向量空间中。现有的图形表示学习方法可分为两类:学习图中潜在连通性分布的生成模型,以及预测一对顶点之间存在边的概率的判别模型。(2)创新...

流式计算--实战(日志监控系统)_时空恋旅人的博客-程序员信息网

1.日志监控系统         数据的流向:flume+kafka+storm+mysql    数据流程如下: 应用程序使用log4j产生日志 部署flume客户端监控应用程序产生的日志信息,并发送到kafka集群中 storm spout拉去kafka的数据进行消费,逐条过滤每条日志的进行规则判断,对符合规则的日志进行邮件告警。 最后将告警的信息保存到mysql数...

Windows本地搜索_输微的博客-程序员信息网

搜索文件名可以使用 Everything ,效率比Windows的文件搜索要快一万倍搜索多个二进制文件的内容比如要搜索多个Excel文件、多个Word文件可以先将这些文件置于一个文件夹内,然后使用Windows自身的搜索就可以了...

随便推点

[Spring MVC] @Configuration 的用法_加倍努力中的博客-程序员信息网

原文出处:https://www.cnblogs.com/duanxz/p/7493276.html从Spring3.0,@Configuration用于定义配置类,可替换xml配置文件,被注解的类内部包含有一个或多个被@Bean注解的方法,这些方法将会被AnnotationConfigApplicationContext或AnnotationConfigWebApplicationContex...

POJ2406 Power Strings KMP-next数组的循环节_AC_Gibson的博客-程序员信息网

题目大意:给定一个字符串,让你找出该字符串的最大循环节。分析:next数组的循环节问题。一开始我是暴力next数组的每一个值,找出其中满足循环的最大值,后来发现这样做不可行,因为对于aaaaaab这个字符串来说,他的循环节很明显为1,但aaaaaa这个子串的循环节是6,所以找出整个next数组的最大循环节就出错了。其实我们只需找出next[ len ]这一个值的循环节即可,因为这是个后

Pycharm print打印输出显示不全 有省略号问题 tensor numpy pandas_RPG_Zero的博客-程序员信息网

如果是Pandas,则设置如下代码:import pandas as pdimport numpy as nppd.set_option('display.max_columns', None) #显示完整的列pd.set_option('display.max_rows', None) #显示完整的行如果是numpy:import numpy as npnp.set_printoptions(threshold=np.inf)如果是tensor,则先转换为numpy中的数据类型

统计文件字数,并按出现次数打印结果_侠之大者为国为民的博客-程序员信息网

#!/usr/bin/env python3# coding=utf-8import stringdic={}with open("test.txt","r") as f: txt = f.read()number= [str(n) for n in range(10)]alpha = list(string.ascii_letters)dot = list("\\\t

oracle数据库是db还是dbnms,Oracle数据库日常管理手册_项目现场篇(13页)-原创力文档..._特殊后勤小干事的博客-程序员信息网

Oracle数据库日常管理 _ 项目现场篇修改: 2010/2/8查看所有的实例及其后台进程是否正常确认所有的instance工作正常,登陆到所有的数据库或instance上,检测oracle后台进程GDDB4-/export/home/oracle&gt; env | grep SIDORACLE_SID=UWNMS3GDDB4-/export/home/oracle&gt; ps -ef|gr...

Android使用Handler实现子线程与子线程、子线程与主线程之间通信_梵韵的博客-程序员信息网_android handler 子线程

转载:https://blog.csdn.net/shaoenxiao/article/details/54561753今天这篇文章只讲一下怎么使用Handler实现子线程与子线程之间、子线程与主线程之间如何进行通信,关于具体的内部实现因为我也没研究过,所以这篇文章讲不了。一、子线程向主线程传值:这个实现比较简单,因为主线程自带Looper机制,所有我们不用创建Looper了,看一下代码吧:首选在...

推荐文章

热门文章

相关标签