随笔分类 -  微信小程序

1 2 3 4 下一页
文字设置空格或换行
摘要:一、空格: //使用 &ensp; (占中文字符一半的大小) <view> <text decode="true">姓&ensp;&ensp;名</text> </view> //使用 &emsp; (占中文字符的大小) <view> <text decode="true">姓&emsp;&emsp 阅读全文
posted @ 2024-06-14 18:19 周文豪 阅读(37) 评论(0) 推荐(0) 编辑
微信小程序:滚动tab栏
摘要:1、wxml <view > <scroll-view scroll-x="true" class="tab-h" scroll-left="{{scrollLeft}}"> <view wx:for="{{tabs}}" wx:for-index="index" wx:key="id" class 阅读全文
posted @ 2024-01-30 14:23 周文豪 阅读(97) 评论(0) 推荐(0) 编辑
微信小程序: 传递对象数据
摘要:一、传递参数的页面 wxml <view class="right"> <view class="status" style="color: {{item.color}}"> {{item.status}} </view> <view class="Dealstatus" style="backgr 阅读全文
posted @ 2024-01-30 14:21 周文豪 阅读(198) 评论(0) 推荐(0) 编辑
微信小程序:弹框
摘要:一、自定义弹框组件 1、组件定义 在components目录下创建dialog文件夹,然后选择文件夹,右键,点击"新建Component",就会创建四个文件。如下所示: wxml <!--components/dialog/index.wxml--> <view wx:if="{{isShow}}" 阅读全文
posted @ 2024-01-29 15:38 周文豪 阅读(1033) 评论(0) 推荐(0) 编辑
微信小程序:生成二维码
摘要:wxml <view> <button bindtap='createQrcode' type="primary" style="width: 400rpx;margin-top: 400rpx;">生成二维码</button> <canvas id='qrcode' type="2d" style 阅读全文
posted @ 2024-01-29 10:52 周文豪 阅读(259) 评论(0) 推荐(0) 编辑
微信小程序:获取不到表单数据
摘要:今天碰到了一件让我怀疑人生的事情:获取不到表单的数据,但是productName能获取到数据,其他的都获取不到数据,而且他们的写法一模一样。 <view class="contain" style="margin-bottom: 200rpx;"> <form bindsubmit="formSub 阅读全文
posted @ 2023-09-22 16:10 周文豪 阅读(184) 评论(0) 推荐(0) 编辑
微信小程序:富文本编辑器组件
摘要:参考文章:微信小程序之实现封装一个富文本编辑器 Editor 的完整流程【附demo源码】欢迎点赞收藏 地址:https://blog.csdn.net/XH_jing/article/details/115509316 demo源码: https://github.com/jxh1997/Edit 阅读全文
posted @ 2023-08-03 10:37 周文豪 阅读(3313) 评论(0) 推荐(0) 编辑
微信小程序:隐藏按钮边框
摘要:1、先给button加一个plain属性 <button wx:elif="{{isLogin}}" type="default" plain class="userinfo-avatar" open-type="chooseAvatar" bind:chooseavatar="onChooseAv 阅读全文
posted @ 2023-08-02 10:34 周文豪 阅读(379) 评论(0) 推荐(0) 编辑
微信小程序:扫一扫
摘要:代码: <view class="my-bar1"> <van-cell icon="qr" title="扫一扫" size="large" is-link bind:click="scanOrderCode" /> </view> 效果: scanOrderCode方法: scanOrderCo 阅读全文
posted @ 2023-07-17 17:49 周文豪 阅读(114) 评论(0) 推荐(0) 编辑
微信小程序:@vant/weapp的使用
摘要:官网地址:https://vant-contrib.gitee.io/vant-weapp/#/quickstart#bei-jing-zhi-shi 一、npm init初始化项目 cmd进入项目根目录,输入如下 命令: npm init 不会操作的话可以参考:https://www.cnblog 阅读全文
posted @ 2023-02-28 16:57 周文豪 阅读(1788) 评论(0) 推荐(0) 编辑
微信小程序:点击navigator标签有阴影
摘要:点击图片,发现右侧和下侧有阴影,效果如下: 错误代码: <navigator url="/pages/overview/overview?title=荆州介绍" open-type="navigate" > <image src="/image/xiaogan-overview.png" mode= 阅读全文
posted @ 2023-02-24 15:47 周文豪 阅读(303) 评论(0) 推荐(0) 编辑
微信小程序:样式总结
摘要:总结: 1、如果想让一个view水平和竖向均居中。 另外,vertical-align:竖向居中。 2、如果想让标题只显示2行,多余的显示… 超出一行就隐藏: white-space: nowrap; text-overflow: ellipsis; overflow: hidden; white- 阅读全文
posted @ 2023-02-21 09:44 周文豪 阅读(2104) 评论(0) 推荐(0) 编辑
微信小程序:如何使用weui.wxss中的icon?
摘要:使用步骤: 1、在app.json中设置 "useExtendedLib": { "weui": true }, 2、icon代码 <text>1</text> <view class="weui-icon-circle"></view> <view class="weui-icon-downloa 阅读全文
posted @ 2023-02-20 18:29 周文豪 阅读(552) 评论(0) 推荐(0) 编辑
微信小程序:地图组件入门
摘要:一、入门案例 新建一个页面,在wxml文件中编写下面的代码 <map/> 效果如下: 发现此时地点在北京。 我们设置一下地图的宽和高 <map style="width:100%;height: 600rpx;"/> 效果如下: 没错,通过这段代码,默认就能调用出一个地图组件,但是仅仅能显示地图而已 阅读全文
posted @ 2023-02-20 11:12 周文豪 阅读(3453) 评论(0) 推荐(2) 编辑
微信小程序:自定义tabBar实现中间图标突出效果
摘要:自定义tabBar使用wxapp-customTabbar组件,网址:https://github.com/SuRuiGit/wxapp-customTabbar editTabbar: function() { let tabbar = this.globalData.tabBar; let cu 阅读全文
posted @ 2023-02-03 16:12 周文豪 阅读(2507) 评论(0) 推荐(0) 编辑
微信小程序:自定义导航栏
摘要:自定义导航栏使用weapp-navigation-bar组件,网址:https://github.com/mulook/weapp-navigation-bar 使用说明: 1、app.json配置以下属性 "window": { "backgroundTextStyle": "light", "n 阅读全文
posted @ 2023-02-03 09:35 周文豪 阅读(2155) 评论(0) 推荐(1) 编辑
微信小程序之地图选地、城市选择、地铁图、路线规划
摘要:一、简介 腾讯位置服务为微信小程序提供了基础的标点能力、线和圆的绘制接口等地图组件和位置展示、地图选点等地图API位置服务能力支持,使得开发者可以自由地实现自己的微信小程序产品。 在此基础上,腾讯位置服务微信小程序JavaScript SDK是专为小程序开发者提供的LBS数据服务工具包,可以在小程序 阅读全文
posted @ 2023-02-01 14:09 周文豪 阅读(5116) 评论(0) 推荐(1) 编辑
微信小程序之视频播放
摘要:一、video属性介绍 先看下video的属性,与audio基本类似 video组件常用于视频的播放,默认宽度为300px,高度为225px。 二、要实现的效果 先看看功能 1、发送弹幕 在输入框中输入弹幕内容,点击“发送弹幕”,屏幕上就会出现你输入的弹幕内容。 2、获取视频 点击获取视频按钮,弹框 阅读全文
posted @ 2023-01-31 16:58 周文豪 阅读(5726) 评论(0) 推荐(0) 编辑
微信小程序:如何获取openid?
摘要:官方解释:https://developers.weixin.qq.com/community/develop/article/doc/000c80906b4210625f3bde3775bc13 我们看看不使用云开发的情况: 第一步、调用wx.login获取code,再携带code像后台发起请求 阅读全文
posted @ 2021-12-02 10:37 周文豪 阅读(9165) 评论(0) 推荐(0) 编辑
微信小程序 如何让button按钮长度变为100%
摘要:效果: 将width设置为width: 100%;也不生效 解决办法:将app.wxss中的"style": "v2",删除即可 效果: 阅读全文
posted @ 2021-11-25 12:10 周文豪 阅读(593) 评论(0) 推荐(0) 编辑

1 2 3 4 下一页