微信小程序
暖风阵阵
这个作者很懒,什么都没留下…
展开
-
微信小程序:返回上页传参
1,本页// index.wxml<view>{{value}}</view><view>----------------------------</view><button type="primary" bindtap="goNextPageClick">点击</button>// index.jsPage({ data: { value:'' }, goNextPageClick(){ wx.原创 2021-12-30 16:34:54 · 192 阅读 · 0 评论 -
【微信小程序使用canvas绘制二维码】
1,在util文件夹中的common.js//引入import drawQrcode from './qrcode.min.js';import draw2dQrcode from './weapp.qrcode.esm.js';//导出封装的公用方法export default{//老版二维码:canvas-id="testQrcode" qrcode(canvas,text,width,height){ drawQrcode({ width: width || 16原创 2021-12-30 15:30:39 · 1711 阅读 · 1 评论 -
wx小程序提交form
wx小程序提交表单form原创 2021-12-22 10:40:42 · 354 阅读 · 0 评论 -
微信小程序封装组件(二)传参
1,准备子组件tab// tab.json{ "component": true}// tab.jsComponent({ options: { multipleSlots: true // 在组件定义时的选项中启用多slot支持 }, //接收父组件的参数 properties: { tabList: { type: Array, value: [] }, tabId: .原创 2021-10-16 21:55:35 · 313 阅读 · 0 评论 -
微信小程序封装组件--列表
1,准备子组件–列表// list.josn{ "component": true}// list.jsComponent({ options: { multipleSlots: true // 在组件定义时的选项中启用多slot支持 }, //接收父组件的参数 properties: { list: { type: Array, value: [] }, },//组件的方.原创 2021-10-16 21:42:34 · 1489 阅读 · 0 评论 -
微信小程序--更改数组中的该条数据的字段
处理数据//(1)wxml<view style="margin: 40rpx 100rpx;"> <view wx:for='{{list}}' wx:for-item='item' wx:key='index' class="row" > <view data-index='{{index}}' data-collet='{{item.ifCollet}}' bindtap="selectFruitClick"> <!-- 1原创 2021-09-17 17:21:34 · 532 阅读 · 0 评论 -
微信小程序--点击选中(一或多)+提交参数
点击选中1,wxml2,js3,util.js4,css1,wxml// An highlighted block<view style="margin: 40rpx 100rpx;"> <view wx:for='{{list}}' wx:for-item='item' wx:key='index' class="row" > <view class="{{item.select?'select':''}}" data-index='{{in原创 2021-09-17 11:17:38 · 925 阅读 · 0 评论 -
倒计时15分钟
微信小程序中,从一个页面点击跳到下一页,开始倒计时15分钟//(1) wxml<view class="box"> <text class="time">{{time.M}}</text> <text class="time">{{time.m}}</text> <text>:</text> <text class="time">{{time.S}}</text> <te原创 2021-09-16 16:02:15 · 1007 阅读 · 0 评论 -
微信小程序封装tab组件--自定义组件
微信小程序封装组件1,准备子组件1,准备子组件//新建components文件夹,再建tab文件如下// (1)tab.wxml<view class="tabBox"> <view wx:for="{{tabList}}" wx:key='index' class="tab"> <view class='{{item.id==tabId?"active":""}}' bindtap="_tabChange" data-id='{{ite原创 2021-09-08 22:11:26 · 492 阅读 · 0 评论 -
微信小程序checkbox复选框5选3(二)
复选框checkbox5选31,wxml2,js3,wxss1,wxmlview>{{machineItem.list.length+'选'+machineItem.duration}}</view><!-- 循环的是label,在整个大盒子绑定事件,所以得到的e.detail.value是个数组 --><checkbox-group bindchange="changeCheckbox"> <label wx:for='{{machineIte.原创 2021-09-07 19:44:01 · 333 阅读 · 0 评论 -
微信小程序自定义组件:弹框
自定义组件1,新建componets文件夹,popup文件夹中4个文件2,在modal中使用popup组件1,新建componets文件夹,popup文件夹中4个文件//1, index.wxml<view class="wx-popup" wx:if="{{flag}}"> <view class='popup-container'> <view class="wx-popup-title">{{title}}</view> <原创 2021-05-13 17:38:03 · 1007 阅读 · 0 评论 -
全局通用样式
全局通用样式如何插入一段漂亮的代码片如何插入一段漂亮的代码片page{ width: 750rpx; font-size: 30rpx; background-color: #eee; } button::after{ border: none; } /* 容器 */ .white-view{ margin: 20rpx; padding: 20rpx; background-color: #fff; border-radius: 16rpx; } /* 边原创 2021-03-09 14:53:34 · 94 阅读 · 0 评论 -
微信小程序复选框checkbox4选2(一)
复选框checkbox4选2处理数据1,wxml2,js3,wxss处理数据fruit:'21234' //字符串fruit:{ //对象,数组 num: "2", display: "苹果、草莓", list: [ {type: "1", selected: true, name: "苹果", val: "补脑养血、宁神安眠、健脾养心"}, {type: "2", selected: true, name: "草莓", val: "生津止渴、润肺健脾"}, {type: "3原创 2021-02-04 15:05:54 · 435 阅读 · 0 评论 -
使用canvas之趣味制作(三)八卦图
canvas之趣味制作矩形如何插入一段漂亮的代码片如何插入一段漂亮的代码片//wxml<canvas type="2d" id="tiJi" width="200" height="200" style="border:2rpx solid #c3c3c3;margin:100rpx auto;"></canvas>//jsPage({ onLoad() { //三、太极 const quaryTai = wx.createSelectorQuery(原创 2021-02-02 15:25:54 · 174 阅读 · 0 评论 -
使用canvas之趣味制作(二)笑脸
canvas之趣味制作笑脸如何插入一段漂亮的代码片如何插入一段漂亮的代码片//wxml<canvas type="2d" id="myCycle"></canvas>//jsPage({ onLoad() { //二、圆 const query2 = wx.createSelectorQuery() query2.select('#myCycle').fields({ node: true, size: true }).exec(res =>原创 2021-02-02 15:24:17 · 173 阅读 · 0 评论 -
使用canvas之趣味制作(一)矩形
canvas之趣味制作矩形如何插入一段漂亮的代码片如何插入一段漂亮的代码片//wxml<canvas type="2d" id="myCycle"></canvas>//jsPage({ onLoad() { //一、矩形 const query = wx.createSelectorQuery() query.select('#myCanvas').fields({ node: true, size: true }).exec(res =>原创 2021-02-02 15:21:38 · 71 阅读 · 0 评论 -
flex布局
flex布局一、百分比1,wxml2,css二、具体宽高2.1,wxml2.2,css一、百分比1,wxml// An highlighted block<view class="parent"> <view class="child"> <view></view> </view> <view class="child"> <view></view> </view&g原创 2021-02-01 16:52:08 · 77 阅读 · 0 评论 -
微信小程序之抽屉
微信小程序之抽屉wxmlcssjswxml// An highlighted block<view data-status="open" bindtap="handleShowTecModelClick">抽屉</view><view class="mask" data-status="close" wx:if="{{model}}" bindtap='handleCancelTecClick'></view><view animation原创 2021-01-22 15:37:32 · 1311 阅读 · 0 评论 -
微信小程序之复选框多选
1,wxml <!-- 循环整个复选框,保证点击复选框和文字都能选中 --> <checkbox-group bindchange="handleCheckboxChange"> <label wx:for='{{unitList}}' wx:key='index' class="notice-flex between view-margin-bottom"> <view class="notice-flex"> <checkbo原创 2020-12-21 14:32:45 · 1285 阅读 · 0 评论 -
微信小程序之布局切换
微信小程序布局切换1,wxml部分2,wxss部分3,js部分1,wxml部分// An highlighted block<view class="img-view row end"> <image src="{{active?'/img/row.png':'/img/column.png'}}" class="flex-img" bindtap='flexClick'/></view><view class="list-view bd-radius原创 2020-12-21 14:10:30 · 290 阅读 · 0 评论