追格资讯小程序(Uniapp专业版)中,首页中的图标默认是滚动模式,有些用户希望调整为自动换行模式。那么我们该如何调整呢?
在追格资讯小程序的首页模板中,其实我们已经为大家预制了图标的两种展示方式,通过简单的调整,无需调整css,就可以从滚动模式切换为自动换行模式。
接下来给大家说说如何调整
打开追格资讯小程序(Uniapp专业版)的首页模板index.vue 找到以下代码:
<!-- icon -->
<!-- 图标导航 滚动模式-->
<view v-if="iconNav && iconNav.length>0" class="jiangqie-scroll-icon">
<scroll-view scroll-x="true">
<view class="jiangqie-iconbox" :data-link="item.link" @click="iconNavItemClick"
v-for="(item,index) in (iconNav)" :key="index">
<image mode="aspectFill" class="jiangqie-iconimg" :src="item.icon"></image>
<text>{{item.title}}</text>
</view>
</scroll-view>
</view>
<!-- 图标导航 自动换行模式 -->
<!-- <view v-if="iconNav && iconNav.length>0" class="jiangqie-icon" style="display: none;">
<view class="jiangqie-iconbox" :data-link="item.link" @click="iconNavItemClick"
v-for="(item,index) in (iconNav)" :key="index">
<image class="jiangqie-iconimg" :src="item.icon"></image>
<text>{{item.title}}</text>
</view>
</view> -->
1、将图标导航滚动模式注释或者增加:style="display: none;"
2、同时将图标导航自动换行模式去掉:style="display: none;",同时取消注释便可以实现以下效果了:
-
如何利用css的延迟属性结合简单js实现渐变动效通过简单的Scss+TypeScript。我们可以实现视频中常见的渐变动效,这里是通过原生css+JS来实现的
-
如何利用css和简单JavaScript实现文字渐隐动态效果通过css的animation动画及js循环控制实现
-
追格小程序V1.8.5更新发布@好友模块与隐私协议接口追格小程序是一个积木式小程序搭建框架,基于uniapp+WordPress开发的微信小程序,代码免费开源不加密且支持二开,安装追格相应扩展模块(模块支持按需购买),简单配置即可快速搭建不限于圈子社区、知识付费、活动报名、资讯等类型小程序。
-
追格小程序全部产品都已添加隐私弹框为什么不在微信小程序SDK中弹出隐私弹框
-
追格资讯小程序(开源版)更新发布隐私协议接口追格资讯小程序Free(又称酱茄free),实现WordPress网站数据与小程序同步共享,简单的配置就能搭建自己的资讯/博客小程序。一套代码多端适用(微信端、百度端、QQ端、H5端)。
-
WordPress后台隐藏评论菜单入口的方法追格资讯小程序小编讲了《WordPress后台仅限管理员查看评论的修改方法》,今天我们说说WordPress后台隐藏评论菜单入口的方法。
暂无评论,抢个沙发...