大家都知道，针对一款app上面都是展示信息的，那么在小程序中，页面上信息的展示是如何的，接下来进行详细探索：
在微信小程序中，编写页面布局是在wxml文件中进行的，则在wxml文件中，使用<view></view>标签进行内容的包裹，类似html中的<div>,现在进行一个需求的编写，在页面上编写布局，并将js结尾文件中的处理数据进行展示到页面上；
indexwml
indexjs
编译项目，则页面展示如下：
从上面结果可以知道在wxml文件中使用{{}}可以将js文件中指定的内容展示在页面上，现在我们进行动态的展示数据，不需要展示起在page-data中固定的内容,修改js文件内容:
编译项目，显示结果如图：
由此可知，在js中动态的设置内容并将其更新到wml上，则使用 thissetData()，且修改的内容格式符合key:value。
就小程序页面数据展示就分析到这里，希望各位看官们有所收获，有什么错误的地方还望指出！！
微信小程序中修改元素位置通常是通过修改CSS样式来实现的，例如设置元素的position属性为absolute或者relative，再设置top和left属性来控制元素的位置。
修改元素位置的原因可能有很多，比如：
1 布局需要：在页面布局中，有时需要将元素移到特定的位置，以实现更好的布局效果。比如，将一个按钮移到页面的中央位置，让用户更容易找到它。
2 动态效果：有时候需要对元素进行动态的位置调整，比如在用户点击某个按钮时，将一个弹窗移到屏幕中央位置来展示。
3 响应式布局：在响应式布局中，元素的位置可能会随着屏幕尺寸的变化而变化，这时需要通过修改元素的位置来实现响应式布局。
需要注意的是，修改元素位置时需要考虑元素之间的相互影响，避免出现布局混乱或者重叠的情况。
目前市场上小程序制作的方式主要有两种（1）找专门的软件开发公司知进行定制开发，这种开发方式的成本费用会比较高，仅定制开发一个小程序就需要上万元甚至是十几万，并且商家还需要购买服务器或者是租赁服务器，再加上服务器每年的维护费，这道也会是一笔不小的开支，并且定制开发小程序的话，小程序的开发周期也比较长，一般需要好几个月。（2）借助第三方工具，自己制作小程序，不需要代码，操作简单，拼图式制作小程序，零基础上手。并且这种情版况下的费用不会很高，只需要几千块钱就可以快速拥有自己的小程序，并且开发周期也比较短，一般一周左右就可以实现小程序的上线使权用。以上就是两种比较常见的小程序制作方式，至于怎么选择，还是要结合一下你自身的经营状况的。
制作自己的微信小程序主要是分为两部分：第一部分是注册微信小程序账号；第二部分是做微信小程序。
第一步：注册微信小程序账号1在浏览器中搜索微信公众号，进入微信公众平台官网；2点击注册；3注册完之后，点击小程序；4填写信息，点击注册；5注册成功之后，点击微信小程序；6点击右上角添加小程序。注意：建议大家优先注册企业或个体工商户主体账号，否则个人主体会有很多权限和功能无法使用。另外提前准备好小程序制作的素材。
第二步：做微信小程序方法一：适合小白如果你是一名不懂代码开发的小白可以通过第三方小程序制作工具或者外包的方式进行制作。先来说一下第三方制作工具，一般分为：选择小程序模板-设计小程序-发布小程序这几个步骤。选择小程序模板：根据所在行业选择对应行业的模板；设计小程序：提前准备好需要的素材，将这些素材添加到小程序中，并且修改模板中的内容。一般情况下还可以设置主题色、导航、页面设计、分类板块、自定义设置文章布局、广告位等发布小程序：全部设置完之后可以进行预览，按照提示将之前注册好的小程序账号授权给此工具，点击发布，微信小程序便制作完成，我们便可以进行日常运营了。注意：小程序的内容要丰富，并且与经营范围相符，否则不容易通过审核。
在需要的时候使用它，用完即走。
这一句应该是当前对于小程序大家都存在争议的一点。
我在猜想，小程序会不会是微信在对于AR领域的一种前瞻性布局。
相信看过“虚拟现实”类动漫和小说的人，应该很容易理解那种AR式的人机交互。
比如：
走在路上，经过一个蛋糕店，看到一款蛋糕，AR的情况下就是在虚空中点击一下蛋糕，然后会显示出蛋糕的价格、成分等等信息。而微信的场景，是蛋糕旁边放着一个二维码，用户掏出微信扫一扫就能打开某个小程序中这个蛋糕的页面，一样可以查看价格、成分等信息。
类似的场景可以有非常多，包括网上各种O2O的构思等等，其实以AR的角度来理解是不是很容易就能说得通了？
现在微信引导大家使用小程序，而当AR普及的时候，微信AR版已经能够借由小程序承载这种新的交互需求。
最初打算使用scroll-view实现，效果好、流畅、有惯性滑动，但由于滚动条没法去掉、无法实现上下层的帧布局，最终放弃了。 还是自己写个吧，利用手势事件。遗憾的是小程序中目前没有像Android中快速滑动事件，所以，要实现惯性滑动是不可能了。 item的布局： 推荐小程序优先使用flex布局，完全够用。这也是微信推荐的。 <view wx:for="{{cardTeams}}" wx:for-item="cardTeam" id="{{cardTeam/images/20150928/tooopen_sy_143912755726jpg" mode="scaleToFill"></image> <view class="number-wrapper"> <text class="name">{{cardTeamname}}</text> <view class="count-wrapper"> <view class="decrease-btn">-</view> <text class="count">1</text> <view class="increase-btn">+</view> </view> <view class="price-wrapper"> <text class="unit">¥</text> <text class="price">9980</text> </view> </view> <view class="ok"><view class="inner-ok">确定</view></view> <view class="remove" data-id="{{cardTeamid}}" bindtap="delItem"><view>删除</view></view> </view> 主要是将删除按钮的设为绝对定位(position: absolute)： item remove{ width: 60px; height: 100%; background-color: red; position: absolute; top: 0; right: -60px; display: flex; justify-content: center; align-items: center; } Page({ data: { cardTeams:[{"id":"aaaaa", "name":"android教程", "url":"", "right":0, "startRight":0},{"id":"bbbb", "name":"小程序教程", "url":"", "right":0, "startRight":0}] }, drawStart : function(e){ // consolelog("drawStart"); var touch = etouches[0]; startX = touchclientX; startY = touchclientY; var cardTeams = thisdatacardTeams; for(var i in cardTeams){ var data = cardTeams[i]; datastartRight = dataright; } key = true; }, drawEnd : function(e){ consolelog("drawEnd"); var cardTeams = thisdatacardTeams; for(var i in cardTeams){ var data = cardTeams[i]; if(dataright <= 100/2){ dataright = 0; }else{ dataright = maxRight; } } thissetData({ cardTeams:cardTeams }); }, drawMove : function(e){ //consolelog("drawMove"); var self = this; var dataId = ecurrentTargetid; var cardTeams = thisdatacardTeams; if(key){ var touch = etouches[0]; endX = touchclientX; endY = touchclientY; consolelog("startX="+startX+" endX="+endX ); if(endX - startX == 0) return ; var res = cardTeams; //从右往左 if((endX - startX) < 0){ for(var k in res){ var data = res[k]; if(res[k]id == dataId){ var startRight = res[k]startRight; var change = startX - endX; startRight += change; if(startRight > maxRight) startRight = maxRight; res[k]right = startRight; } } }else{//从左往右 for(var k in res){ var data = res[k]; if(res[k]id == dataId){ var startRight = res[k]startRight; var change = endX - startX; startRight -= change; if(startRight < 0) startRight = 0; res[k]right = startRight ; } } } selfsetData({ cardTeams:cardTeams }); } }, //删除item delItem: function(e){ var dataId = etargetdatasetid; consolelog("删除"+dataId); var cardTeams = thisdatacardTeams; var newCardTeams = []; for(var i in cardTeams){ var item = cardTeams[i]; if(itemid != dataId){ newCardTeamspush(item); } } thissetData({ cardTeams:newCardTeams }); }, onLoad: function () { consolelog('onLoad:'+appglobalDatadomain) } }) drawStart用于记录手指触碰时的位置，drawMove记录手指滑动的位置，两者的差值就是删除按钮的偏移量 drawEnd手指抬起时触发，用于设置弹回、摊开效果。目前我的是超过一半自动弹开，不足一半自动收回。 以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
微信小程序的制作步骤：
1 下载并安装微信开发者工具
微信开发者工具是微信小程序开发的专用工具，可以在官方网站上免费下载，并按照提示安装即可。
2 创建小程序项目
在微信开发者工具中，选择“小程序项目”，填写项目的名称、AppID等基本信息，选择项目存放的路径后，即可创建一个新的小程序项目。（想做小程序可以在榕诗科技看看哦）
3 编写代码
微信小程序主要使用JavaScript语言开发，需搭配使用WXML（微信小程序页面结构语言）和WXSS（微信小程序页面样式语言）来完成页面的布局和样式设计等工作。在微信开发者工具中，打开新建的项目文件夹，找到“pages”文件夹，在其中创建自己需要的页面，并用以上语言完成编写。
4 调试和预览
编写完毕后，可以在微信开发者工具中选择“预览”按钮，即可预览自己的小程序页面，也可以进行调试，查看小程序在不同手机、不同网络环境下的运行情况。
5 提交审核
完成编写、调试和预览后，可以选择“上传”按钮，将自己的小程序提交到微信小程序平台，并填写基本信息和审核要求等。然后，等待微信小程序官方的审核和发布，即可正式上线自己的小程序了。
题主是否想询问“微信小程序分割线居中如何吗”？分割线居中如下：
1、首先实现微信小程序居中，可以用flex布局工具。
2、其次将alignitems改成justifycontent。
3、最后常见的方法使用绝对定位配合负值margin，思路是设成absolute后，指定top和left为百分之50，将元素的左上角定位点放到页面的正中心，然后使用负值margin一半的元素宽高度将元素拉回页面正中心。
