基础内容text:官方文档

Demo Code

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')
})
}
}
})

JS

<view class="btn-area">
<view class="body-view">
<text>{{text}}</text>
<button bindtap="add">add line</button>
<button bindtap="remove">remove line</button>
</view>
</view>

WXML

.btn-area{
font-family:Verdana, Geneva, Tahoma, sans-serif;
padding: 0 10px 0 10px;
}
.body-view button{
margin-top :10px;
}

WXSS

微信小程序组件text的更多相关文章

  1. 微信小程序组件学习 -- 注册页面

    微信小程序组件使用手册地址: 1. 百度搜索"微信公众平台",扫码登录之后,点击帮助文档里面的普通小程序. 2. 接着选择"开发"-->"组件& ...

  2. 微信小程序组件设计规范

    微信小程序组件设计规范 组件化开发的思想贯穿着我开发设计过程的始终.在过去很长一段时间里,我都受益于这种思想. 组件可复用 - 减少了重复代码量 组件做为抽离的功能单元 - 方便维护 组件作为temp ...

  3. 微信小程序组件解读和分析:五、text文本

    text文本组件说明: text 文本就是微信小程序中显示出来的文本. text文本组件的示例代码运行效果如下: 下面是WXML代码: [XML] 纯文本查看 复制代码 ? 1 2 3 4 <v ...

  4. 【腾讯Bugly干货分享】打造“微信小程序”组件化开发框架

    本文来自于腾讯Bugly公众号(weixinBugly),未经作者同意,请勿转载,原文地址:http://mp.weixin.qq.com/s/2nQzsuqq7Avgs8wsRizUhw 作者:Gc ...

  5. 微信小程序——组件(二)

    在上篇文章组件(一)里已经讲解了如何创建一个项目,现在继续...讲解一个页面布局以及各个组件的使用.在学习过程中,发现小程序支持flex布局,这对于学习过react native的人来说太好了,布局方 ...

  6. 微信小程序组件解读和分析:六、progress进度条

    progress进度条组件说明: 进度条,就是表示事情当前完成到什么地步了,可以让用户视觉上感知事情的执行.progress进度条是微信小程序的组件,和HTML5的进度条progress类似. pro ...

  7. 微信小程序组件通信入门及组件生命周期函数

    组件生命周期函数链接地址:https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/lifetimes.h ...

  8. 微信小程序组件构建UI界面小练手 —— 表单登录注册微信小程序

    通过微信小程序中丰富的表单组件来完成登录界面.手机快速注册界面.企业用户注册界面的微信小程序设计. 将会用到view视图容器组件.button按钮组件.image图片组件.input输入框组件.che ...

  9. 微信小程序组件封装及调用-原生

    封装一个弹窗组件 1.新建component文件夹存放我们的组件,里边存放的就是我们所用的组件,我们今天要做的事弹出框,新建文件夹popup存放我们的组件模板,点击右键选择新建component,就会 ...

随机推荐

  1. 企业Shell面试题5:解决DOS攻击生产案例

    企业Shell面试题5:解决DOS攻击生产案例 写一个Shell脚本解决DOS攻击生产案例. 请根据web日志或者或者网络连接数,监控当某个IP并发连接数或者短时内PV达到100(读者根据实际情况设定 ...

  2. Flask 安装 快速入门

    $ pip install flask Flask自带的Server在端口5000上监听: ython app.py flask通过request.form['name']来获取表单的内容. 外部可见 ...

  3. Respond.js – 让不懂爱的 IE6-8 支持 CSS3 Media Query

    respond.min.js <script src="js/respond.min.js"></script> respond.min.js代码: /*! ...

  4. vs 常用工具

    工欲善其事,必先利其器,没有好的工具,怎么能高效的开发出高质量的代码呢?本文为 ASP.NET 开发者介绍一些高效实用的工具,包括 SQL 管理,VS插件,内存管理,诊断工具等,涉及开发过程的各个环节 ...

  5. 【BZOJ】3402: [Usaco2009 Open]Hide and Seek 捉迷藏(spfa)

    http://www.lydsy.com/JudgeOnline/problem.php?id=3402 又是spfa水题.. #include <cstdio> #include < ...

  6. Openstack(Kilo)安装系列之Keystone(三)

    安装配置 Before you configure the OpenStack Identity service, you must create a database and an administ ...

  7. asp.net页面触发事件panel滚动条高度不变的实现方法

    asp.net页面按钮点击触发事件后panel滚动条非自动回到顶端,每次都要往下拉一下,关于这个问题的解决方法如下 此文是为解决asp.net页面按钮点击触发事件后panel滚动条非自动回到顶端的解决 ...

  8. VC++ 在Watch窗口显示GetLastError值以及详细信息

    You can display the value GetLastError() will return by putting "@err" in your watch windo ...

  9. 52、图片缩放库 PhotoView

    PhotoView的简介: 这是一个图片查看库,实现图片浏览功能,支持pinch(捏合)手势或者点击放大缩小.支持在ViewPager中翻页浏览图片. PhotoView 是一款扩展自Android ...

  10. tarjan求强连通分量+缩点 模板

    #define N 100100 #define M 200200 int n,m; int id,index; //id表示缩点后点的id,index表示进行tarjan算法时访问的点先后 int ...