微信小程序 - 随笔分类 - 周文豪

文字设置空格或换行

摘要：一、空格： //使用 &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 周文豪阅读(197) 评论(0) 推荐(0) 编辑

微信小程序：弹框

摘要：一、自定义弹框组件 1、组件定义在components目录下创建dialog文件夹，然后选择文件夹，右键，点击"新建Component"，就会创建四个文件。如下所示： wxml  <view wx:if="{{isShow}}" 阅读全文

posted @ 2024-01-29 15:38 周文豪阅读(1030) 评论(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 周文豪阅读(3303) 评论(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 周文豪阅读(377) 评论(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 周文豪阅读(1784) 评论(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 周文豪阅读(2102) 评论(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 周文豪阅读(3451) 评论(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 周文豪阅读(2504) 评论(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 周文豪阅读(2152) 评论(0) 推荐(1) 编辑

微信小程序之地图选地、城市选择、地铁图、路线规划

摘要：一、简介腾讯位置服务为微信小程序提供了基础的标点能力、线和圆的绘制接口等地图组件和位置展示、地图选点等地图API位置服务能力支持，使得开发者可以自由地实现自己的微信小程序产品。在此基础上，腾讯位置服务微信小程序JavaScript SDK是专为小程序开发者提供的LBS数据服务工具包，可以在小程序阅读全文

posted @ 2023-02-01 14:09 周文豪阅读(5108) 评论(0) 推荐(1) 编辑

微信小程序之视频播放

摘要：一、video属性介绍先看下video的属性，与audio基本类似 video组件常用于视频的播放，默认宽度为300px，高度为225px。二、要实现的效果先看看功能 1、发送弹幕在输入框中输入弹幕内容，点击“发送弹幕”，屏幕上就会出现你输入的弹幕内容。 2、获取视频点击获取视频按钮，弹框阅读全文

posted @ 2023-01-31 16:58 周文豪阅读(5723) 评论(0) 推荐(0) 编辑

微信小程序：如何获取openid?

摘要：官方解释：https://developers.weixin.qq.com/community/develop/article/doc/000c80906b4210625f3bde3775bc13 我们看看不使用云开发的情况：第一步、调用wx.login获取code，再携带code像后台发起请求阅读全文

posted @ 2021-12-02 10:37 周文豪阅读(9164) 评论(0) 推荐(0) 编辑

微信小程序如何让button按钮长度变为100%

摘要：效果：将width设置为width: 100%;也不生效解决办法：将app.wxss中的"style": "v2",删除即可效果：阅读全文

posted @ 2021-11-25 12:10 周文豪阅读(592) 评论(0) 推荐(0) 编辑

随笔分类 - 微信小程序