微信小程序_基础
微信小程序的基础开发知识
豫北小蚂蚁
这个作者很懒,什么都没留下…
展开
-
【微信小程序】我们来聊聊用vscode开发工具
【微信小程序】我们来聊聊用vscode开发工具梦游人布拿拿关注0.3122019.08.23 12:12:42字数 232阅读 3,812早就听说vscode(Visual Studio Code)开发小程序很爽,没有原生的那种卡顿(莫名黑屏啥的)。然后我也试了一下,然后打开项目后,我傻眼了。vscode文件目录黑人问号脸层次结构也太不明显了吧,看的我难受。...转载 2020-03-09 09:32:42 · 1644 阅读 · 0 评论 -
Position属性四个值:static、fixed、absolute和relative的区别和用法
先看下各个属性值的定义:1、static(静态定位):默认值。没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明)。2、relative(相对定位):生成相对定位的元素,通过top,bottom,left,right的设置相对于其正常(原先本身)位置进行定位。可通过z-index进行层次分级。 3、absolute(绝对...原创 2020-03-31 10:56:55 · 625 阅读 · 0 评论 -
小程序Dialog弹出窗
js// pages/dialog/dialog.jsPage({ /** * 页面的初始数据 */ data: { showModalStatus: false }, click1:function(){ wx.showToast({ title: '纯文字弹窗', icon: 'non...原创 2020-03-31 09:21:08 · 1149 阅读 · 0 评论 -
overflow text-overflow 属性详解
1 overflow 属性规定当内容溢出元素框时发生的事情。文本,单词一个算一个整体默认情况visible2text-overflow 文本无法完全显示 默认clip原创 2020-03-30 10:04:13 · 700 阅读 · 0 评论 -
word-break word-wrap详细解析
word-wrap 强调的是是否允许单词内断句,word-break强调的则是怎么样来进行单词内的断句。1 默认的时候先要明确一点,不加word-wrap或word-break的时候,就是浏览器默认的时候,如果有一个单词很长,导致一行中剩下的空间已经放不下它时,则浏览器会把这个单词挪到下一行去:变态长,容器放不下,冲出去2 解决1 允许单词换行 变态长加wor...转载 2020-03-30 09:45:04 · 346 阅读 · 0 评论 -
小程序动画 ro
属性讲解 rotateX --- (-180 180)用2d平面理解 (相当于缩放Y轴 90度时候 y相当于0) rotateY 同上相当于缩放X轴 90度时候 X相当于0/* 动画部分 */ // 第1步:创建动画实例 var animation = wx.createAnimation({ duration: 200, //动画...原创 2020-03-23 16:23:18 · 281 阅读 · 0 评论 -
自适应布局webkit-box的用法
转载webin最后发布于2019-05-15 17:10:11阅读数 3437收藏展开自适应布局webkit-box的用法Flexible Box Model(灵活盒子模型)在平常的web横排布局中,会经常用到float或display:inline-block,但是在多种不同宽度的移动设备的自适应布局中用的话,还得设置百分比宽度和考虑清除浮动。而Flexible Bo...原创 2020-03-23 13:39:20 · 533 阅读 · 0 评论 -
小程序 踩坑日常
scroll-view 列表不显示wx:for='{{choice}}' 写成wx:for='choice'原创 2020-03-22 21:43:55 · 90 阅读 · 0 评论 -
scroll-view 定位显示问题popwindow
1 包裹scroll-view 的view z-index 设置(需设置position属性,否则可能会产生图层移动)设置 absolute; top;auto;===原先的top位置z-index生效原则,只对相同有position属性的组件生效,不对staic生效。单独的position<!-- location content --><view styl...原创 2020-03-21 23:45:40 · 884 阅读 · 0 评论 -
下拉刷新
1 .json中起用 @1 起用"enablePullDownRefresh": true, @2 背景色默认白,将刷新的色调设置为黑"backgroundTextStyle": "dark"{ "usingComponents": {}, "navigationBarBackgroundColor": "#ff0000", "enablePullDown...原创 2020-03-20 16:44:51 · 106 阅读 · 0 评论 -
小程序出现 返回顶部按钮 top
加一个按钮 page中重写方法onPageScroll (page中的方法) onPageScroll: function (e) { if (e.scrollTop > 500){ this.setData({ isDisplay: true}) }else{ this.setData({ isDisplay: false }) ...原创 2020-03-19 20:50:46 · 390 阅读 · 0 评论 -
loading 加载进度窗
<loading hidden="{{hidden}}">玩命加载中…</loading>原创 2020-03-19 18:07:20 · 185 阅读 · 0 评论 -
text 文本居中
<text style="width: 3rem;height: 3rem;line-height: 3rem; border-radius: 50%;background-color: red;color: white;margin: auto;text-align: center;">预约 </text>1 文本自身居中 水平居中text-align:...原创 2020-03-19 17:51:53 · 5981 阅读 · 0 评论 -
image自适应高度
1---flex 伸缩布局display:flex;(伸缩布局才可以 将后续撑起的高度,再次分配到image)2 --方向是水平方向flex-direction:row;不能有相关垂直属性加入(align-items:center;加入后不再分配高度)3--image需要包裹一层view view可以设置宽度,不设置高度image有默认高度240px 需要包裹一层...原创 2020-03-19 17:43:14 · 2710 阅读 · 0 评论 -
text单行和多行显示控制
1.单行文本溢出显示省略号 (3个同时使用)overflow:hidden; //溢出隐藏text-overflow:ellipsis;//超出显示省略号white-space:nowrap;//强制文本在一行内显示2.文本显示行数控制 (4个同时使用)overflow: hidden;text-overflow: ellipsis; // 超出显示'...'disp...原创 2020-03-19 17:07:09 · 2256 阅读 · 0 评论 -
小程序轮播图swiper补充
相对于上一篇的内容 ,, 减少了2层view嵌套原创 2020-03-19 11:31:27 · 117 阅读 · 0 评论 -
小程序 导航按钮列表实现navigator
小知识鉴别inline(行内元素):不会独占一行.不能更改元素的height,width的值,大小由内容撑开.可以使用padding,margin只有left和right产生边距效果,但是top和bottom就不行.block(块级元素):独占一行,默认填满父级元素的宽度.够改变元素的height,width的值.可以设置padding,margin的各个属性值inline-...原创 2020-03-18 14:58:58 · 1537 阅读 · 0 评论 -
小程序轮播图swiper实现
wxml ---***vertical写上之后一定要是"{{false}}" 直接写"false"会是true,方向一直是垂直<!--pages/index4/index4.wxml--><view class="container"> <!-- swiper轮播图 --> <view class="swiper-cont...原创 2020-03-18 14:24:35 · 248 阅读 · 0 评论