热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

微信小程序-基础内容组件

icon图标示例:<view><blockwx:for{{iconSize}}><icontypesuc

icon 图标

示例:

<view class="group">
<block wx:for="{{iconSize}}">
<icon type="success" size="{{item}}"/>
block>
view>

<view class="group">
<block wx:for="{{iconType}}">
<icon type="{{item}}" size="45"/>
block>
view>


<view class="group">
<block wx:for="{{iconColor}}">
<icon type="success" size="45" color="{{item}}"/>
block>
view>
Page({
data: {
iconSize: [
20, 30, 40, 50, 60, 70],
iconColor: [
'red', 'orange', 'yellow', 'green', 'rgb(0,255,255)', 'blue', 'purple'
],
iconType: [
'success', 'info', 'warn', 'waiting', 'safe_success', 'safe_warn',
'success_circle', 'success_no_circle', 'waiting_circle', 'circle', 'download',
'info_circle', 'cancel', 'search', 'clear'
]
}
})

text  文本

支持转义符"\"。

 组件内只支持  嵌套。

除了文本节点以外的其他节点都无法长按选中。

示例:



{{text}}



var initData = 'this is first line\nthis is second line'
var extraLine = [];
Page({
data: {
text: initData
},
add:
function(e) {
extraLine.push(
'other line')
this.setData({
text: initData
+ '\n' + extraLine.join('\n')
})
},
remove:
function(e) {
if (extraLine.length > 0) {
extraLine.pop()
this.setData({
text: initData
+ '\n' + extraLine.join('\n')
})
}
}
})

progress  进度条




 


推荐阅读
  • 表单代码 ... [详细]
  • 我在尝试将组合框转换为具有自动完成功能时遇到了一个问题,即页面上的列表框也被转换成了自动完成下拉框,而不是保持原有的多选列表框形式。 ... [详细]
  • 微信小程序实现星级评分与展示
    这篇文章主要为大家详细介绍了微信小程序实现星级评分与展示,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的 ... [详细]
  • 本文介绍了如何利用JavaScript或jQuery来判断网页中的文本框是否处于焦点状态,以及如何检测鼠标是否悬停在指定的HTML元素上。 ... [详细]
  • 使用JS、HTML5和C3创建自定义弹出窗口
    本文介绍如何结合JavaScript、HTML5和C3.js来实现一个功能丰富的自定义弹出窗口。通过具体的代码示例,详细讲解了实现过程中的关键步骤和技术要点。 ... [详细]
  • Flutter入门指南:实现自动关闭的对话框与提示
    本文为Flutter系列教程的一部分,专注于讲解如何在Flutter应用中实现自动关闭的对话框和提示。通过具体的代码示例,帮助开发者掌握SnackBar、BottomSheet和Dialog的使用方法。 ... [详细]
  • 微信小程序API音频-暂停播放是千自学中一篇关于微信小程序的文章简介:wx.pauseVoice(Objectobject)从基础库 1.6.0 开始,本接口停止维护,请使用 wx.createInnerAudioContext 代替暂停正在播放的语 ... [详细]
  • 微信小程序中如何实现轮播图
    这篇文章主要介绍了微信小程序中如何实现轮播图,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带 ... [详细]
  • 微信小程序实现简易计算器功能_javascript技巧
    这篇文章主要为大家详细介绍了微信小程序实现简易计算器功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的 ... [详细]
  • 本文详细介绍了如何解决Uploadify插件在Internet Explorer(IE)9和10版本中遇到的点击失效及JQuery运行时错误问题。通过修改相关JavaScript代码,确保上传功能在不同浏览器环境中的一致性和稳定性。 ... [详细]
  • 云函数与数据库API实现增删查改的对比
    本文将深入探讨使用云函数和数据库API实现数据操作(增删查改)的不同方法,通过详细的代码示例帮助读者更好地理解和掌握这些技术。文章不仅提供代码实现,还解释了每种方法的特点和适用场景。 ... [详细]
  • 微信html替换右键菜单,jquery右键菜单
    插件描述:一个最简单的,很好看的jQuery右键菜单一个最简单的,很好看的jQuery右键菜单特点唯一的依赖是jQuery。简单的API。 ... [详细]
  • 小编给大家分享一下微信小程序中下拉刷新及上拉加载的示例分析,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这 ... [详细]
  • 微信小程序实战之菜谱小程序
    最近突发奇想,想要自己搞个小程序玩儿玩儿,但是鉴于自己是搞后端服务器出身,对于偏前端的微信小程序开发实在是一知半解,尤其是对于css类样式相关,更是无从下手,于是乎,只能从晚上找了 ... [详细]
  • 本文主要介绍关于微信小程序,小程序,今日头条,新闻,前端的知识点,对【仿今日头条实时新闻微信小程序项目源码】和【自己怎么弄微信小程序】有兴趣的朋友可以看下由【叶绿体不忘呼吸】投稿的技术文章,希望该技术 ... [详细]
author-avatar
讨厌上学的-彭志超-_354
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有