微信小程序实现滚动标签

news2024/11/29 14:53:58

使用scroll-view标签可实现组件滚动标签

1、list中 list.wxml代码如下:

<!--pages/list/list.wxml-->
<navigation-bar
    title="小程序" 
    back="{{false}}"
    color="black" background="#FFF">
 </navigation-bar>

<scroll-view class="container1" scroll-y>

<view>A</view>

<view>B</view>

<view>C</view>

</scroll-view>

2、list中 list.less代码实现如下:

/* pages/list/list.wxss */
.container1 view{
  width: 100px;
  height: 100px;
  text-align: center;
  line-height: 100px;
}

.container1 view:nth-child(1){
  background-color: lightcoral;
}

.container1 view:nth-child(2){
  background-color: lightgreen;
}

.container1 view:nth-child(3){
  background-color:lightblue;
}

.container1{
  border: 1px solid lightblue;
  width: 100px;
  height: 100px;
}

3、别忘记将list布局文件放置在app.json的page函数的第一项o

4、代码实现结果如下:

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1576504.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

「媒体宣传」科技IT行业有哪些媒体邀约资源-51媒体网

传媒如春雨&#xff0c;润物细无声&#xff0c;大家好&#xff0c;我是51媒体网胡老师。 科技IT行业的媒体邀约资源非常丰富&#xff0c;包括了各种类型的传统媒体和新兴的网络媒体平台。以下是一些主要的媒体邀约资源&#xff1a; 除此之外&#xff0c;还有一些其他科技类网络…

finebi6.0中我的分析中...中加自己的菜单

js的两个扩展点是&#xff1a; BI.config("bi.result_wrapper", function (e) {return e.showMerge !0, e}),BI.config("bi.analysis.admin_list", function (e) {return e.showMergeUser !0, e}) 对应的组件在conf.min.js中的 bi.search_sort 点击事件…

【多线程】Callable详解

Callable接口 先看看Callable接口的源码: Callable是一个函数式接口&#xff0c;此时就可以用lambda表达式更简洁地使用它。Callable是个泛型接口&#xff0c;只有一个方法call&#xff0c;该方法返回类型就是传递进来的V类型。call方法还支持抛出异常. 与Callable对应的是Ru…

「媒体宣传」产业金融财经媒体邀约资源有哪些-51媒体

传媒如春雨&#xff0c;润物细无声&#xff0c;大家好&#xff0c;我是51媒体网胡老师。 产业金融财经领域的媒体邀约资源涵盖了多种平台和形式&#xff0c;主要包括以下几类&#xff1a; 杂志和报纸&#xff1a;如《中国经济周刊》和《中国证券报》&#xff0c;它们通常报道财…

从零开始:构建、打包并上传个人前端组件库至私有npm仓库的完整指南

文章目录 一、写组件1、注册全局组件方法2、组件13、组件2 二、测试三、发布1、配置package.json2、生成库包3、配置发布信息4、发布 四、使用1、安装2、使用 一、写组件 1、注册全局组件方法 plugins/index.js const requireComponent require.context(./, true, /\.vue$/…

idea常用配置

IDEA设置全局配置 参考&#xff1a;IDEA设置全局配置_idea如何打开一个项目,全局设置-CSDN博客 idea提交代码到git或svn上时&#xff0c;怎么忽略.class、.iml文件和文件夹等不必要的文件 参考&#xff1a;idea提交代码到git或svn上时&#xff0c;怎么忽略.class、.iml文件和文…

学浪app中的视频怎么缓存

现在越来越多人在学浪app里面购买课程&#xff0c;有的课程有时间限制&#xff0c;想要下载下来&#xff0c;如果你还不知道下载的方法&#xff0c;可以看看我这篇文章&#xff0c;专门讲解如何缓存学浪app里面的课程 讲技术方法很多人可能听不懂&#xff0c;所以我就将技术融…

室友打团太吵?一条命令让它卡死

「作者主页」&#xff1a;士别三日wyx 「作者简介」&#xff1a;CSDN top100、阿里云博客专家、华为云享专家、网络安全领域优质创作者 「推荐专栏」&#xff1a;更多干货&#xff0c;请关注专栏《网络安全自学教程》 SYN Flood 1、hping3实现SYN Flood1.1、主机探测1.2、扫描端…

BugKu:Flask_FileUpload

1.打开此题 通过题目知道这个是一个关于Flask的文件上传的漏洞题目 2.查看网页源代码 Flask是一个使用Python编写的轻量级Web应用框架。 这里又提示说用python来运行结果&#xff0c;那很有可能就是要通过python脚本来抓取flag 3.编辑Python脚本 工具&#xff1a;pycharm 文件…

C++从入门到精通——this指针

this指针 前言一、this指针的引出问题 二、this指针的特性三、例题什么时候会出现编译报错什么时候会出现运行崩溃this指针存在哪里this指针可以为空吗 四、C语言和C实现Stack的对比C语言实现C实现 前言 this指针是一个特殊的指针&#xff0c;在C类的成员函数中使用。它指向调…

高校本科毕业论文word 自动化模板

高校本科毕业论文word 自动化模板 “一份好的论文模板能真正能够让作者专注于内容&#xff0c;而不用关注令人烦恼的排版细节问题, 例如插入页眉页码、插入目录、编号、交叉引用、参考文献等等。本文提供中山大学本科毕业论文Word模板&#xff0c;已经按照学校最新格式规范设置…

Qt使用iostream的cout

在QT想使用iostream的cout。 参考以下博客&#xff1a; &#xff08;转载&#xff09;Qt中使用cout输出的方法 pro里加上; CONFIG console勾选 Run in Terminal clean工程&#xff0c;重新构建 上面是cout的&#xff0c;下面是我的另一个函数的qDebug输出的。

专业140+总410+国防科技大学831信号与系统考研经验国防科大电子信息与通信,真题,大纲,参考书。

应群里同学要求&#xff0c;总结一下我自己的复习经历&#xff0c;希望对大家有所借鉴&#xff0c;报考国防科技大学&#xff0c;专业课831信号与系统140&#xff0c;总分410&#xff0c;大家以前一直认为国防科技大学时军校&#xff0c;从而很少关注这所军中清华&#xff0c;现…

位运算、芯片封装方式、中断、定时器

我要成为嵌入式高手之4月3、7日51单片机第一、二天&#xff01;&#xff01; ———————————————————————————— 裸机驱动&#xff1a;51 -> s3c2440 -> linux Soc片上系统 位运算 高位&#xff1a;MSB 地位&#xff1a;LSB 按位与&…

如何从应用商店Microsoft Store免费下载安装HEVC视频扩展插件

在电脑上打开一张HEIC类型的图片提示缺少HEVC解码器&#xff0c;无法打开查看&#xff0c;现象如下&#xff1a; 这种情况一般会提示我们需要下载安装HEVC解码器&#xff0c;点击“立即下载并安装”会跳转到应用商店&#xff0c;但是我们发现需要付费7元才能下载安装 免费安装…

七、Ajax(Django开发)

Ajax&#xff08;Django开发&#xff09; 知识点的回顾&#xff1a;1.Ajax请求2.订单小结3.图表4.关于文件上传4.1基本操作案例&#xff1a;批量上传数据案例&#xff1a;混合数据&#xff08;Form&#xff09;4.2启用media案例&#xff1a;混合数据&#xff08;form&#xff0…

如何理解图像处理领域的病态问题(ill-posed problem)

ill-posed problem&#xff0c;我们可以理解为病态问题或者不适定问题。在本文中&#xff0c;统一成为不适定问题。 在讨论不适定问题&#xff08;ill-posed problem&#xff09;之前&#xff0c;我们先来看一下什么叫适定性问题&#xff08;well-posed problem&#xff09;。…

计算机视觉——基于深度学习检测监控视频发生异常事件的算法实现

1. 简介 视频异常检测&#xff08;VAD&#xff09;是一门旨在自动化监控视频分析的技术&#xff0c;其核心目标是利用计算机视觉系统来监测监控摄像头的画面&#xff0c;并自动检测其中的异常或非常规活动。随着监控摄像头在各种场合的广泛应用&#xff0c;人工监视已经变得不…

SAP HCM PT 2003修改班次,PP61无法自动更新

今天遇到一个问题&#xff0c;2003修改班次以后PP61无法自动更新&#xff0c;开始一直以为是什么配置点漏掉&#xff0c;但是发现开发机没问题&#xff0c;后来发现是用户选保存的时候选中目标计划的完成&#xff0c;这个是保存到实际计划的&#xff0c;数据存储psoll中&#x…

【引子】C++从介绍到HelloWorld

C从介绍到HelloWorld 一、C的介绍1. 简介2. 应用场景3. C的标准![在这里插入图片描述](https://img-blog.csdnimg.cn/direct/e3efb0f207f647729b92c0b5bcd4b330.png)4. C的运行过程 二、Visual Studio的安装1. 什么是Visual Studio2. Visual Studio的安装 三、完成HelloWorld1.…