qq_43773083的博客

转载 微信小程序之二维码生成

转载微信小程序生成二维码wxml<view id="container"> <view class="ewm"> <canvas style="width: 600rpx; height: 600rpx;" canvas-id="myQrcode"></canvas> </view> <input class="inpt" bindinput="ewmText" value="{{ text }}"></

原创 微信小程序之计时器

wxml<text>{{days}}天{{hours}}:{{minute}}:{{second}}</text>js（data）days: '0' + 0, //天hours: '0' + 0, // 时minute: '0' + 0, // 分second: '0' + 0, // 秒js（methods）// 计时 //开始订单计时器 startSetInter: function () { const that = this var

原创 微信小程序之环形图

HTML<view class = "page"> <view style="width:350rpx;height:280rpx;border:1rpx solid #f40;"> <image wx:if="{{imgUrl}}" src="{{imgUrl}}" style="width:350rpx;height:280rpx;"></image> <canvas wx:else canvas-id="annular-pie" ec=

原创 将canvas转化为图片（不设置setTimeout）

把cxt_arc.draw（）；改成var that = this;that.createImg(cxt_arc);methodcreateImg(cxt_arc) { //生成图片 var that = this; cxt_arc.draw(false, function () { wx.canvasToTempFilePath({ //写在 draw的回调里面才能生成图片 canvasId: 'annular-triangle', success: function (

原创 微信小程序——定位

借鉴：微信小程序中实现手指缩放图片wxml<mynav title="定位" /><view class="page"> <view class="touch-container"> <image class="img" src="{{src}}" style="width: {{width}}rpx; height: {{height}}rpx; left: {{left}}rpx; top: {{top}}rpx; transform: transl

原创 微信小程序F2饼形图的引入和赋值

jsimport F2 from "../../../../components/f2-canvas/lib/f2"let pie = null;function setOption(pie,a,b,c,d,e) { // F2实现回调的方法，方法名用来最后赋值绑定 var map = { '待检查': (b/a)*100+'%', '处理中':(c/a)*100+'%', '流转中':(d/a)*100+'%', '已结束': (e/a)*100+'%', }

原创 微信小程序之百度地图之定位AND输入地址定位AND输入经纬度定位

1.bmap-wx.min.js例子链接2.ak3.getLocation.js// 引用百度地图微信小程序JSAPI模块 var bmap = require('./bmap-wx.min');function getLocation(sourceObj, successFun, failFun) { var BMap = new bmap.BMapWX({ ak: "#",//申请获取到的ak }); // 发起regeocoding检索请求 BMap.

原创 小程序js：数组筛选。。。

var request = require('../../../../../utils/request.js');const app = getApp();Page({ data: { activeNames: [], //折叠面板展开项 show: false, //是否展示内容 chooseshow: false, //是否展示选择框 TextContent: "", //当前展示内容中的内容 currentImg: "", //当前上传的图片 c

原创 nav

wxml<view class="oc-head"> <view class="head_bg" style="color: {{fontColorTop}}; background-color: {{backgroundColorTop}}; padding-top: {{top}}px; height: {{height}}px; font-size: {{fontSize}}px;"></view> <view class="head-container

原创 奇奇怪怪的知识点

1.微信小程序style的三目运算style="text-decoration: {{ (index > 2)? 'none' : 'underline' }}"

原创 微信小程序request封装

1.request.js// 传入api，返回完整urlconst build = url => { var r = getApp().globalData.serverHost + url return r;}//传入api， 返回带token的urlconst buildWithToken = url => { var r = getApp().globalData.serverHost + url + "/" + getApp().globalData.token

原创 ES6映射（解构赋值）实例（代码补全，只截取了关键部分）

mapping(list) { var List = []; list.forEach((element, index, list) => { if (this.data.type1) { let { place: col1, distance: col3, id: col4, statu: col5, time: ...

原创 微信小程序组件的属性、样式、方法

Component({ /** * 组件的属性列表 */ properties: { cellList:Object, }, /** * 组件的外部样式 */ externalClasses: ['c-cellrow'],//不可使用大写字母,必须有'-' /** * 组件的初始数据 */ data: { }, /** * 组件的方法列表 */ methods: { cellClick(res)

原创 js 小数取整的函数

1.丢弃小数部分,保留整数部分parseInt(10/3)2.向上取整,有小数就整数部分加1Math.ceil(10/3)3.四舍五入Math.round(10/3)4.向下取整Math.floor(10/3)

原创 使用popup的时候无法用form嵌套textarea导致value值的获取的问题的解决方案；popup中placeholder悬浮的解决方案

wxml<van-popup show="{{ delateShow }}" custom-style="min-height: 30%;width:90%;border-radius:10rpx;"> <view class="popHeader">单位作废</view> <view class="popContent c00"> <view class="s30" style="line-height:80rpx;">作废说明<

原创 数组的增减，以拍照为例

takephoto(){ var that = this; var arr = this.data.imgList; wx.chooseImage({ count: 1, sizeType: ['original', 'compressed'], sourceType: ['album', 'camera'], success (res) { // tempFilePath可以作为img标签的src属性显示图片 ..

原创 带参数返回

choose(res) { var index = res.currentTarget.dataset.index; var data = res.currentTarget.dataset.set; this.setData({ selected: index, }) let pages = getCurrentPages(); let prevPage = pages[pages.length - 2]; prevPage.setDa

原创 多行打点展示/单行打点展示

多行打点展示 /* box的高度 */ height: 100rpx; /* 超出隐藏 */ overflow: hidden; /* 设置盒子样式，-webkit-是兼容前缀 */ display: -webkit-box; /* 设置盒子参考方式 */ -webkit-box-orient: vertical; /* 设置超出多少行显示省略号 */ -w...

原创 组件实时获取宽高

util.jsmodule.exports = { //获取节点信息 queryView: function (context,name, success) { const query = wx.createSelectorQuery().in(context) query.select(name).boundingClientRect(function (res) { suc...

原创 java+vue+javaweb练习

准备工作：1.前端代码编辑器（Hbuilder）2.后端代码编辑器（eclispe)3.由江老师提供的后端接口代码demo一、后端接口的创建1.拷贝demo并重命名为202003272.右击src文件夹→new→package→urlDemo（起名）→Finish3.右击urlDemo文件→new→class→PageData（起名）→Finish4.点击PageData文件→编写...

原创 font-faimly字体大全

清 font-size:100px 为例font-family:“Arial”,“Microsoft YaHei”,“黑体”,“宋体”,sans-serif;font-family:Tahoma,Helvetica,Arial,‘宋体’,sans-serif;font-family: ‘Microsoft YaHei’,arial,tahoma,\5b8b\4f53,sans...

原创 让背景图片充满整个屏幕

.login_box{ position:absolute; width:100%; height:100%; display:flex; justify-content: center; align-items: center; flex-direction: column; background-image: url(https:...

原创 乱七八糟的图片

原创 vscode下载安装必备

下载网址：https://code.visualstudio.com/Download英文改中文使用快捷键【Ctrl+Shift+P】弹出查找命令框，输入language，找到Configure Display Language，点击，打开locale.json，编辑locale属性为"zh-CN"点击左侧工具栏的extensions或者使用快捷键【Ctrl+Shift+X】，输入chin...

原创 主流浏览器及其内核

浏览器内核IETridentFirefox，即火狐浏览器GeckoSafari、曾经的ChromeWebkitOperaPrestoChromeBlink

原创 js之数组

详细文档链接数组的方法简介方法描述concat()连接两个或更多的数组，并返回结果。join()把数组中的所有元素转换一个字符串。元素通过指定的分隔符进行分隔。pop()删除并返回数组的最后一个元素push()向数组的末尾添加一个或更多元素，并返回新的长度。reverse()颠倒数组中元素的顺序。shift()删除并返回数组的第一...

原创 ES6（持续更新中。。。）

let命令var命令全局有效，let命令只在块级作用域内有效let命令在for循环中，设置循环变量的那部分是一个父作用域，而循环体内部是一个单独的子作用域let命令不存在变量提升，必须声明后使用let命令存在暂时性死区（TDZ），即只要块级作用域内存在let命令，它所声明的变量就绑定这个区域，不受外部影响。const命令如是。let命令不允许在相同作用域内重复声明同一个变量，所以不能在...

原创 什么是闭包？

详细解释：闭包的详细解释闭包的例子闭包产生的原因函数与对其状态即词法环境的引用共同构成闭包。也就是说，可以让你从内部函数访问外部函数的作用域。在JavaScript，函数在每次创建时生成闭包。因为内部函数访问到外部函数作用域的变量，所以内部函数就是一个闭包函数。为什么闭包函数能够访问其他函数的作用域？ 在函数内访问某个变量是根据函数作用域链来判断变量是否存在的，而函数作用域链是...

原创 ES6总结之一

文档学习网站：es6入门一、let命令let声明的变量只在它所在的代码块有效。let声明的变量仅在块级作用域内有效for循环设置循环变量的那部分是一个父作用域，而循环体内部是一个单独的子作用域上面代码中，变量i是let声明的，当前的i只在本轮循环有效，所以每一次循环的i其实都是一个新的变量，所以最后输出的是6。你可能会问，如果每一轮循环的变量i都是重新声明的，那它怎么知道上一轮...

原创 jQueryAjax总结

一、发送get请求get() <form id="myForm"> 姓名：<input type="text" name="name"> 信息：<input type="text" name="message"> </form> <button id="btn00">get&l...

原创 书签存储页，持续更新中。。。

组件六个优秀的微信小程序UI组件VantweuiiView Weappecharts-for-weixinEChartsF2UIIconfontUI中国渐变色设计坞在线PSrgb与十六进制的转换工具证件照换底色网站模板在线图片转icon格式工具uimaker视频网站HTML和CSS入门教程一块钱付费课程—HTML和CSS入门课程，增加了多个小de...

原创 ＣＳＳ总结

基本选择器：标签选择器：针对一类标签ID选择器：针对某一个特定的标签使用类选择器：针对你想要的所有标签使用通用选择器（通配符）：针对所有的标签都适用我们记住这句话：类上样式，id上行为。意思是说，class属性交给css使用，id属性交给js使用。高级选择器：后代选择器：用空格隔开，描述的是一种祖先结构交集选择器：用.隔开，一般都是以标签名开头，比如div.haha 比如p....

原创 HTML总结

至今为止用过的标签标签描述<!DOCTYPE>定义文档类型<html>定义 HTML 文档<title>定义文档的标题。<body>定义文档的主体。<h1> to <h6>定义 HTML 标题。<p>定义段落。<br>定义简单的折...

原创 Sass总结之一

1、Sass安装（1）到 Ruby 的官网（http://rubyinstaller.org/downloads）下载对应需要的 Ruby 版本。（2）Ruby 安装文件下载好后，可以按应用软件安装步骤进行安装 Ruby。在安装过程中，选择Add executables to your PATH（不选中，就会出现编译时找不到Ruby环境的情况）（3）Cmd打开命令行输入以下命令①gem s...

原创 html5星空背景的登录页面带粒子特效

html<!DOCTYPE html><html lang="en" class="no-js"><head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="view...

原创 微信小程序之温度计

百度了一圈，没发现有微信小程序的温度计，都是基于css3和jquery的温度计，没办法，只能自己手动改啦，静态版代码如下：wxml<view class="contain"> <view class="temp"> <view id="therm-numbers"> <view class="therm-number pos0"...

原创 微信小程序入门指南之（三）

Hello World代码解读一、app.json2、wxml3、js4、wxss

原创 微信小程序入门指南之（二）

微信小程序结构的介绍

原创 微信小程序入门指南之（一）

成功运行第一个微信小程序微信小程序的官方文档文档链接：微信官方文档·小程序如何使用微信小程序的官方文档模块列表:也属于目录模块，相当于我们课本的第几章。新手一般从指南章节开始看起。目录列表：作为一个新新新手只能老老实实的跟着指南先走一遍，一般跟着指南的步骤走很快就可以很顺利的写出我们的第一个微信小程序，指南看不懂的话也可以去慕课网找找小程序入门指南的视频，大概不需要十分钟就可以敲出我...