美文网首页
mui动态渲染轮播图

mui动态渲染轮播图

作者: webjiacheng | 来源:发表于2019-07-26 09:21 被阅读0次

看了下官方文档,轮播图是写死的,顿时一脸蒙逼,这写死的让人怎么用?
我用的是artTemplate渲染的,结果能渲染但是不会动,你说气不气
看了下网上的示例,是要在渲染后再绑定事件的,如下图

//获取虚拟轮播图
      function getBanner() {
        $.get(`${HOST}/v1/banner/getBannerByType/test`, function (res) {
          let { result, msg, data } = res;
          if(data.bannerList.length>1){
            $('.mui-slider-group').html(template('banner_list_tpl', { bannerList: data.bannerList }));
            $('.mui-slider-indicator').html(template('indicator_list_tpl', { indicatorList: data.indicatorList }));
            var slider = mui("#slider");
            slider.slider({
              interval: 3000//设置轮播的毫秒数
            });
            $('.mui-slider').css('display','block')
          }
        })
      }

相关文章

  • mui动态渲染轮播图

    看了下官方文档,轮播图是写死的,顿时一脸蒙逼,这写死的让人怎么用?我用的是artTemplate渲染的,结果能渲染...

  • koa框架-实战(四)

    一、前台页面制作 二、轮播图动态渲染 三、动态路由 四、成功案例分类渲染以及渲染出所有成功案例下面的数据 $in ...

  • mui禁止页面左右滑动

    ``` mui('.mui-slider').slider().setStopped(true); //禁止轮播左...

  • 5.首页轮播图

    轮播图框架(GitHub搜索)flutter_swiper : ^1.1.6 静态轮播图 根据网络请求数据动态加载轮播图

  • MUI组件(4)

    slide(轮播组件) 轮播组件是MUI提供的核心组件之一,基于轮播组件衍生出了图片轮播、可拖动式图文表格、可拖动...

  • 动态轮播图,支持gif动态轮播

    上一篇写过一个轮播图,但上篇有一点遐思, 要是动图的话, 会有那么一点卡顿, 这对app来说那是不能忍的, 这篇介...

  • 使用HBuilder快速搭建App页面 2018-10-22

    MUI:文档 1. md 2. mta 底部选项卡 3.mhe 顶部头 4.mbo 内部写轮播图 5.ms ...

  • 商品详情

    商品详情页面 主要结构,商品图片的轮播图,商品购买区域,商品参数区域 使用mui-card样式构建商品详情界面的三...

  • 1.Axure动态面板之轮播图显示

    Axure中动态面板常用来实现交互效果,如: 使用动态面板制作轮播图。 使用动态面板制作tab页面切换。 使用动态...

  • JS轮播图

    这个轮播图的JS动态代码: var currentNum = 0; var changeBgOfObj = doc...

网友评论

      本文标题:mui动态渲染轮播图

      本文链接:https://www.haomeiwen.com/subject/yynlrctx.html