直接给大家上干货 1.跳转页面传递参数 pageA.wxml <button type="primary" bindtap="jumpTo">点击跳转</button> pageA.js jumpTo:function(){ //传数字 let number=0 //传字符串 let str="字符串" //传json对象 let json={ name:'小王', age:18 } //传json数组 let jsonA

微信小程序实现登陆页面 实现上面两个页面 第一个页面 <view> <!-- 上侧部分 --> <view class="top-view"> <!-- 用户信息开始 --> <view class="user"> <!-- 头像开始 --> <view class="row"> <image class="avatar" wx:if=&

在小程序中所有页面的路由全部由框架进行管理,而框架以栈的形式维护了当前的所有页面. 当发生路由切换时,页面栈的表现: getCurrentPages() 用于获取当前页面栈的实例,可以把 getCurrentPages() 看做当前小程序所有页面的集合.该集合的第一个元素为首页,最后一个元素为当前页. ps:不要尝试修改页面栈,会导致路由以及页面状态错误. // index/index.js ================================ Page({ data:{"id&qu

1.页面注册 既然我们希望跳转到新的页面,那自然要新建页面相关的文件才行.在开篇已经讲过,一个小程序页面由四个文件组成,假如我们的页面名为welcome,那么这四个文件则是: welcome.js welcome.json welcome.wxml welcome.wxss   另外需要注意的是,json文件中至少包含空的结构体 { },而js文件中最好包含空的Page({ })方法,否则会编译出错(新版的IDE中对于空的js文件好像已经不再报错,不过还是建议加上)       新建页面到这里就

微信小程序拥有web网页和Application共同的特征,我们的页面都不是孤立存在的,而是通过和其他页面进行交互,来共同完成系统的功能.今天我们来研究小程序页面之间的跳转方式. 1.先导 在Android中,我们Activity和Fragment都有栈的概念在里面,微信小程序页面也有栈的概念在里面.微信小程序页面跳转有四种方式: 1.wx.navigateTo(OBJECT): 2.wx.redirectTo(OBJECT): 3.wx.switchTab(OBJECT): 4.wx.navi

Java Web项目 我们在Eclipse里开了Java Web项目之后,Run As Tomcat或者Apache服务器,本地运行,如果直接用http://localhost:8080访问项目,会发现浏览器会打开一个默认的页面. 这个页面是在什么地方配置的呢? 每个Java Web工程的目录下面,都有一个名为WEB-INF的目录,里面包含一个配置文件web.xml.Web项目的默认页面就定义在里面的welcome-file-list节点里. Android项目 我们知道一个Android项目里

完整微信小程序授权登录页面教程 1.前言 微信官方对getUserInfo接口做了修改,授权窗口无法直接弹出,而取而代之是需要创建一个button,将其open-type属性绑定getUseInfo方法.在参考了网路上各种方案之后,实现了用户在授权之后跳转到小程序首页的授权登录页面. 2.实现效果 3.实现思路 在进入小程序时先对授权情况进行判断,若已经过授权则直接跳转到首页,若还未经过授权则进入授权页面,点击页面的授权按钮会弹出选择框,选择"拒绝"则不进行跳转,选择"允许&

效果图: 实现原理:点击按钮,往需要动画的div中添加或移除拥有动画效果的class. 由于微信小程序中不能操作page这个根节点,所以,只有用一个div(view)来模仿page根节点. 1.结构 <view class='page {{isFix?"pageShow":"pageHide"}}' > <view class='header'> <view class='h-toggle iconfont icon-list' bin

这个问题我上网搜了一下,答案有多种,但是真正能用的没有几何.很多答案都是雷同,有的网友也不负责任,直接拿来照抄,自己也不跑一遍看看.哎,不说了,说多了全是泪.希望我们的技术达人在分享的时候,能够真实的走一遍代码,尽量能让我等小白看的懂啊.闹骚发过了,下面我们就进入正题吧(__) 嘻嘻…… 今天分享的是不仅仅把页面生成图片,同时,也要满足能够识别图中的二维码.我们先来看看效果图   页面展示   页面生成的图片 canvas组件 要想把页面生成图片,canvas是必不可少的,网上很多朋友说,页面生

在此以插件开发中文章列表跳传文章详情为例. 1.首先在插件中的文章列表页面wxml中绑定跳转事件. bindtap='url' data-id="{{item.article_id}}" 2.在文章列表页面js中接收事件,并触发冒泡事件. /** * 跳转至详情 */ url: function (e) { var eventDetail = { data: a.pdata(e).id, } // 触发事件的选项 bubbles是否冒泡,composed是否可穿越组件边界,captur

在此以插件开发中文章列表跳传文章详情为例. 1.首先在插件中的文章列表页面wxml中绑定跳转事件. bindtap='url' data-id="{{item.article_id}}" 2.在文章列表页面js中接收事件,并触发冒泡事件. /** * 跳转至详情 */ url: function (e) { var eventDetail = { data: a.pdata(e).id, } // 触发事件的选项 bubbles是否冒泡,composed是否可穿越组件边界,captur

1.1.1动态修改页面数据 在小程序中我们经常要动态渲染数据,对于新手而言我们常常遇到修改的数据在控制台显示和页面显示不一致,因为我们用“=”修改数据的,这种是可以修改,但无法改变页面的状态的,还会造成数据不一致,代码如下: data: { array: [{ text: '数组' }] } onLoad:function(){ this.data.array[0].text=1; console.log(this.data.array[0].text); } 修改代码: onLoad:func

目录 1.页面展示 2.wxml代码 3.wxss代码 4.js代码 1.页面展示 2.wxml代码 <!--pages/register/register.wxml--> <scroll-view> <image src='/images/register.png' mode='widthFix' class="topImage"></image> <view class='input-top'> <input id=

首先给大家看看做好的效果图: 一.接下来我们说一下评分这个功能: 实际上就是一个简单的js,首先我们遍历出小星星,此时默认给的五星好评,在给他们一个点击事件,当点击时,我们获取到当前点击的是第几颗:代码如下: var index = e.currentTarget.dataset.index; // 获取当前点击的是第几颗星星 接下来我们暂存星星的数组,获取星星数组的长度,代码如下: var tempUserStars = this.data.userStars; // 暂存星星数组 var l

小程序页面有2种跳转,可以在wxml页面或者js中: 1,在wxml页面中: <navigator url="../index/index">跳转到新页面</navigator> <navigator url="../index/index" open-type="redirect">在当前页打开</navigator> <navigator url="../index/index&

项目中需要一个可拖动的小图标, 1.小程序组件movable-view 文档地址:https://developers.weixin.qq.com/miniprogram/dev/component/movable-view.html#movable-area movable-view可移动的范围是在整个movable-area区域,所以movable-area是必须的,一般图标可以全屏幕移动的,movable-areas就是pages下的最高父级,包裹所有节点的 附上代码,有需要了解的可以直接

微信小程序在两个之间传参类似js传递url拼接参数,举个例子来说吧 input自己设置参数 //index.wxml <form bindsubmit="formSubmit" bindreset="formReset" class="myform"> <text class="prompt">给自己起个名字吧</text> <input placeholder="给自己起个

配置单个页面导航栏的属性: 就在所要配置页面相对应的json文件中写入以下想要设置的属性: { "navigationBarBackgroundColor": "#ffffff",    "navigationBarTextStyle": "black",    "navigationBarTitleText": "小程序" } 属性只需要放在大括号里面即可,每个属性用逗号隔开. 如果不

小程序无法像html中,在页面中直接parseInt() index.wxml {{price | Int}} 小程序还有另一种处理方法 wxs 是一种类似于js脚本的东西 filters.wxs var filters = { toFix: function (value) { return parseFloat(value) } } module.exports = { toFix: filters.toFix } -index.wxml <wxs module="filters&qu

我们知道,在微信小程序中,从一个页面转到另一个页面,一般情况下可以通过navigate或redirect时候的url来携带参数,然后在目标页面的onLoad函数参数中获取这些url参数.例如: // 源页面A相关代码 wx.navigateTo({ url: "/pages/mypage/mypage?a=1&b=2" }) // 目标页面B相关代码 Page({ onLoad: function (options) { var a = options.a; // 值:1 va

什么是事件事件是视图层到逻辑层的通讯方式. 事件可以将用户的行为反馈到逻辑层进行处理. 事件可以绑定在组件上,当达到触发事件,就会执行逻辑层中对应的事件处理函数. 事件对象可以携带额外信息,如 id, dataset, touches. 看图,因为需要传递的数据比较多,所以我们通过dataset携带参数信息.如果只有一个参数,可以通过id来传递. 详解(以常见的tap点击事情为例)wxml:<view id="tapTest" data-hi="WeChat"