项目需要，做一个和今日头条一样的导航栏，可以横行滚动，幸好再weui里面看到了类似的例子 地址：https://weui.shanliwawa.top/demo/js4.html，使用iscroll-lite.j实现，weui自己封装了一层，vue中实现代码： <div id="tab-tip" class="container"><div id="tagnav" class="weui-navigator weui-navigator-wrapper" style="touch-action: none;padding-left:5px"><ul class="weui-navigator-list first_nav"><li class v-for="grou...
使用扫小程序码登陆网站网络上关于实现本本功能的文章很多，但是给出案列的几乎没有，今天笔者实现用小程序码实现网站登陆，体验地址如下https://idea.techidea8.com/open/idea.shtml?id=5思路 核心流程关键流程建立场景sceneid和websocket的绑定关系获得sceneid场景ID可以前端生成，也可以后端生成，只需要保证sceneid的同一时间唯一性即可。前端生成可以采用随机数加时间戳的形式,也可以用uuid算法//时间戳 var sceneid ="scend-...
1.首先下载小程序开发工具 2.小程序中的wxml就相当于html , wxss就相当于css 3.布局和html布局几乎一样 4.宽度使用百分比 5.input框里的文字上下居中是用padding撑出来的 6.最下面的文字靠右，view相当于一个块元素，设定宽度后，text-align右对齐 简单的测试界面如图index.wxml代码 <!--index.wxml--> <view class="container"> <text class="indexTitle">添加邮箱账号</text> <view class="indexInput"><input maxlength="10" pl...
JS中的sender参数（sender是事件的传值）前提是只有一个touch移动的时候。多个touch需要在 changedTouches 数组中查找redclcik:function(sender){wx.showModal({title: 点击红色,content: ,})console.log(sender);},redmove:function(sender){console.log(sender);// console.log(sender.changedTouches[0].pageX);},.wxss内容： <view>移动视图控件</view> <!-- 创建一个move-area --> <movable-area style="width:100%;height:10...
一：npm初始化 如果你的小程序项目没有安装过npm包的话，你需要先初始化npm npm init二：安装npm包 这里以vant-weapp(小程序UI组件库)为例： npm i vant-weapp -S --production三：npm包构建 1：点击微信开发者工具右上角详情——>本地设置，选中使用npm模块2：点击微信开发者工具菜单栏的工具，选择构建npm当显示如下表示npm构建成功，构建完成就可以使用npm包了npm包构建完成之后项目的结构如下：四：使用npm 1：js中引入npm包 c...
怎样实现jq中的slideUp或者slideDown这种动画效果呢，我的思路是用css3的transform: translateY（）属性，给需要动画的元素添加上一个动画class。先上效果图：1.蒙层的结构： <!-- 购物车蒙层 --> <view class=list-fix wx:if="{{mengShow}}" bindtap=outbtn> //mengShow是蒙层是否显示的标志，然后蒙层绑定outbtn的点击事件<view class=in-list {{aniStyle?"slideup":"slidedown"}} catchtap=inbtn> //这里的三元运算符...
微信小程序图表插件（wx-charts）基于canvas绘制，体积小巧，支持图表类型饼图、线图、柱状图 、区域图等图表图形绘制，目前wx-charts是微信小程序图表插件中比较强大好使的一个 支持图标类型 饼图 pie圆环图 ring线图 line柱状图 column区域图 area雷达图 radar如何使用？ 直接引用编译好的文件 dist/charts.js（js下载地址） .wxml中定义 <canvas canvas-id="lineCanvas" disable-scroll="true" class="canvas"></canvas> canvas...
你还在找在小程序成如何将图片转base64存储起来并显示嘛，在这里呢，来瞧瞧。 使用方法js文件 let $this = this; request({url:https://www.dounine.com/hello.jpg,method:GET,responseType: arraybuffer,success:function(res){let base64 = wx.arrayBufferToBase64(res);$this.data.userImageBase64 = data:image/jpg;base64, + base64;;} }); wxml文件 <image src={{userImageBase64}} style=width:90rpx;height:90rpx; /> PS:...
前言 在微信小程序中，可以很简单的分享一个页面，比微信H5简单多了，然而，分享出去的页面（也叫卡片），打开后只是一个单独的页面，没有底部导航栏，点击返回按钮的时候就直接退出小程序了。如果需要去到首页，还必须点击顶部胶囊的“回到首页”，可是该功能很少人知道。为了解决这个问题，有两种解决方案。第一种：在分享的页面在添加显眼的“首页”悬浮按钮，点击按钮跳转到首页。这种方法，好容易理解，可是万一页面多，需要开...
前言 微信小程序是数据驱动的应用，开发技术和vue、react和angular等mv*技术类似。在vue下可以用vue-resource、axios等模块进行http请求，但是在微信小程序上，http请求只支持wx.request(OBJECT)，所以我们需要对wx.request进行封装，实现http拦截器的功能。第一步：创建一个request.js文件第二步：确定http、upload和websocket前缀第三步：封装wx.request在请求发出前处理http地址、请求头和参数、在响应后解析返回值并做基本的逻...
关键是 let that = this 因为在onLoad 的 wx.request方法里， this指的是 wx.request 的上下文， 所以应该是在 onLoad 的时候定义 let that = this 调用远程服务，序列化后，把obj赋值给bookList 最开始的报错代码如下： Page({data: {bookList: []},onLoad: function() {wx.request({url: https://jiashubing.cn/wechat/book,header: {content-type: application/json},success(res) {var obj = JSON.parse(res.data)console.log(...
最近在帮朋友写个小程序，本人小白一枚，但是好在计算机科班出身，有些概念一看还是明白的，只是之前没实际写过程序。于是最近看了好多资料和视频，不得不说，对于小白来讲，还是有点难度，但是不大。 通过最近看资料和别人的视频，总结一下： 1.页面布局，先画好。都是盒子，需要几个盒子，你就先画几个盒子。比如下面这个页面：红色盒子浅蓝盒子绿色盒子（这个绿色盒子里又可以切分成两个盒子：白色字体较大一个盒子，白色字体较...
先描述下目录结构，见下图UI页面见下图其中ok按键是引入的log模块，log模块非page页 indexButton是index页本身拥有的组件，index页直接导入Log模块中的组件，css，事件响应函数。 显示效果如下app.json的内容如下下面附上 index.js、index.wxml、index.wxss的代码下面附上 log.js、log.wxml、log.wxss的代码以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
效果js let app = getApp(); Page({data: {img: "/images/1.jpg"},onLoad() {},showShareMenu() {wx.showShareMenu();console.log("显示了当前页面的转发按钮");},hideShareMenu() {wx.hideShareMenu();console.log("隐藏了当前页面的转发按钮");},onShareAppMessage: (res) => {if (res.from === button) {console.log("来自页面内转发按钮");console.log(res.target);}else {console.log("来自右上角转发菜单")}return {title: 妹...
java后台相关问题一，程序包lombok不存在通常报这个错误，是因为，我们的开发者工具idea没有安装lombok库导致的 解决办法如下：提示我们没有安装，我们就安装一个不就行了，下面来教大家如何安装。1，点击扳手进入设置页2，点击plugins，然后搜索lombok，点击install即可安装3，安装完成后，重启idea开发工具即可二，无法执行sql文件，IDEA 2019.1连接数据库报错(08001)链接mysql数据库报如下错误08001 could not connection to da...