本文实例为大家分享了微信小程序实现留言板功能，可以手写，可以删除，可以快速留言，供大家参考，具体内容如下 const app = getApp(); Page({/*** 页面的初始数据*/data: {msgData:[{child_id: 1,msg:"泡澡水不要太热。",checked:},//双引号{child_id: 2,msg:"面部比较干，想补个水。",checked: },{child_id: 3,msg:"我只有2小时，您看着安排吧。",checked: },{child_id: 4,msg:"我想把眉毛在修下。",checked: },{child_id: 5,msg...
本文为大家分享了微信小程序实现留言板的具体实现方法，供大家参考，具体内容如下 先说一下小程序的开发环境之类的基础东西 1.到微信公众平台下载开发者工具。安装 2.appID与没有appID的区别是，appID可以用真机预览，而没有就不行 3.目录解释：a)pages放页面，每个都必须含有js\json\wxml\wxss四个文件。 js文件类似于js文件，json是配置，比如整个页面顶端的名字颜色之类的，wxml类似于html，wxss类似于css。 其中代码格式也相似...
本文实例为大家分享了微信小程序实现选项卡效果展示的具体代码，供大家参考，具体内容如下demo.wxss .swiper-tab{ width: 100%; border-bottom: 2rpx solid #777777; text-align: center; line-height: 80rpx;} .swiper-tab-list{ font-size: 30rpx; display: inline-block; width: 33.33%; color: #777777; } .on{ color: #da7c0c; border-bottom: 5rpx solid #da7c0c;} .swiper-box{ display: block; height: 100%; width: 10...
今天开发了一个文章的留言版块，于是想到要为某个留言点赞，点过赞的再次点击会取消点赞，代码如下：/*更新点赞*/ update_zan:function(e){ var that = this; var data = e.currentTarget.dataset; var mid = data.mid; var cookie_mid = wx.getStorageSync(zan) || [];//获取全部点赞的mid var isadd = 1; var newmessage = []; if (cookie_mid.includes(mid)){//说明已经点过赞,取消赞 isadd = 0; var m = 0; for (var j in cook...
本文实例为大家分享了微信小程序实现星星评价效果的具体代码，供大家参考，具体内容如下代码实现 wxml文件 <!--pages/evaluatepage/evaluatepage.wxml--><view class=container><view class=evaluate_contant><!--外层循环控制有几个评价条目 --><block wx:for={{evaluate_contant}} wx:key= wx:for-index=idx><view class=evaluate_item><view class=evaluate_title>{{item}}</view><!--星星评价 --><view class=evaluate_box><!-...
空余时间简单写了一个微信小程序ibeacon三点定位。 事先淘宝买了七八个ibeacon小设备，放置在办公司角落。分别设置三个ibeacon的位置坐标点，根据每一个ibeacon到已经开启蓝牙的目标物距离，计算出目标物在当前区域内坐标位置。适用于区域内购物指示。当然，进入该区域事先要打开手机蓝牙。 下面代码： var app = getApp() Page({data: {motto: Hello World,openBLE:打开蓝牙设备,startBLEDiscovery:初始化蓝牙设备,startBLEDevic...
本文实例为大家分享了微信小程序实现笑脸评分的具体代码，供大家参考，具体内容如下 image方式实现的笑脸评分功能由于我这里的图片使用的不是背景图，所以实现方法跟使用背景图的方式不同 你也可以使用wx:for来操作 由于微信小程序需要base64格式或者网图才能设置背景图 所以就没用背景图 首先这里放的是差中好评的三张图，首先进入页面进行评分时需要默认是好评 1.png表示的是未选中图片 2.png代表的是选中的图片 图片点击...
最近接触到小程序，发现很有意思，在项目中遇到了一点小问题，就是点赞+取消点赞有些冲突，还有就是多项的点击，话不多说咱们直接上代码！ 效果图wxml<block wx:for="{{msg}}"><image class=imgList hidden={{item.show}} bindtap=zan data-index={{index}} src=../resizeApi.png></image><image class=imgList hidden={{!item.show}} bindtap=zan data-index={{index}} src=../resizeApi (1).png></image><text> {{item.show}}</t...
前言 微信小程序特点“无须安装，无须卸载，触手可及，用完即走”，适合轻量级应用快速开发。小程序模版思想是它开发的核心思想，可以帮助开发者减少很多重复代码，我们来看看怎么在小程序中实现市面上常用的评分组件, 看看效果图：创建模版 wxml文件： 以<template>为根节点，添加name属性用来区分不同模版： <template name="starsTemplate"><view class=stars-container><view class=stars><block wx:for="{{stars}}" wx:for-it...
本文实例为大家分享了微信小程序实现下拉菜单栏的具体代码，供大家参考，具体内容如下 js代码 var cityData = require(../../utils/city.js); Page({data: {//选择的终点城市暂存数据endselect: "",//终点缓存的五个城市endcitys: [],//用户选择省份之后对应的城市和县城endkeys: {},//用户选择县城town: [],//所有车长commanders: cityData.getcommanders(),//所有车型models: cityData.getmodels(),//选中的车长commander: "",//...
本文实例为大家分享了微信小程序实现层叠轮播图的具体代码，供大家参考，具体内容如下 wxml: <view class="banner-swiper"><swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" current={{swiperCurrent}} indicator-color="{{beforeColor}}" indicator-active-color="{{afterColor}}" circular={{circular}} previous-margin="{{previousmargin}}" next-margin="{{nextmargin}}" bindchange="swiperChange" ><...
本文实例为大家分享了微信小程序实现下拉菜单切换展示的具体代码，供大家参考，具体内容如下 效果图：wxml： <!-- 下拉菜单 --><view id="swiper-tab"><view class="swiper-tab"><view class="swiper-tab-list {{currentTab==0 ? on : }}" data-current="0" bindtap="tabNav">{{first}}<i></i></view><view class="swiper-tab-list {{currentTab==1 ? on : }}" data-current="1" bindtap="tabNav">{{second}}<i></i></view><view c...
本文实例为大家分享了微信小程序实现自动定位的具体代码，供大家参考，具体内容如下 使用了腾讯地图提供的免费api： 需要引入一个js文件：下载地址 js代码： // 引入SDK核心类 var QQMapWX = require(../../libs/qqmap-wx-jssdk.js); var qqmap = new QQMapWX({ //在腾讯地图开放平台申请密钥 http://lbs.qq.com/mykey.htmlkey: your KEY }); Page({data: {myLatitude: "",myLongitude: "",myAddress: ""},onLoad: function(){var...
本文实例为大家分享了微信小程序实现签到功能的具体代码，供大家参考，具体内容如下 效果图：今天是16号，所以显示已签到，渲染页面时请求后台传的参数为这月签到的日期 如：["16", "14"] 点击签到执行 calendarSign sign.wxml <!--index.wxml--> <view class="calendar"><view class=bcfff><view class="weekName"><view class="monday">一</view><view class="tuesday">二</view><view class="wednesday">三</view><view class="...
本文实例为大家分享了简易微信小程序签到功能的具体代码，供大家参考，具体内容如下 一、效果图点击签到后二、数据库 用一张数据表存用户签到的信息，每次用户签到都会往表中添加一条记录了用户id和签到日期的数据，如下图三、后端 后端写两个接口，一个用于查询用户今日是否签到和签到记录总数，一个用于添加用户签到信息到数据库。这里用的是python的flask框架。 （1）查询用户签到信息接口： @app.route(/get_sign/<user_id>) d...