方法:获取page数据,看代码:var text=this.data.name ,这样就获取到初始化的值
page({
data:{name:"test"},
showData:function(){
var text=this.data.name
}
})
示例如下:
util.js
//正则判断
function Regular(str, reg) {
if (reg.test(str))
return true
return false
}
//是否为中文
function IsChinese(str) {
var reg = /^[\u0391-\uFFE5]+$/
return Regular(str, reg)
}
module.exports = {
getRequestUrl: "http://localhost:59637",//获得接口地址
IsChinese: IsChinese,
}
//test.js
var util = require('../../utils/util.js')
Page({
onLoad: function () {
console.log("判断是否为中文:"+util.IsChinese('测试'))
console.log("输出接口url:"+util.getRequestUrl)
}
})
小程序的wxs功能可以让wsmxl可以调用和编写js,基本上wxs和JS无关系,只是语法形式很相似。 如下写了两个关于时间的函数,并将它们导出, <wxs module="m1"> var getMax = function(flightDate) { var now = getDate().getDate() var flDate = getDate(flightDate).getDate() if( now <flDate ){ return '+1' }else{ return '' } } var formartTime = function(flightDate,format){ if(flightDate){ var realDate = getDate(flightDate) function timeFormat(num) { return num <10 ? '0' + num : num } var date = { "Y": timeFormat(realDate.getFullYear()), "M": timeFormat(realDate.getMonth() + 1), "d": timeFormat(realDate.getDate()), "h": timeFormat(realDate.getHours()), "m": timeFormat(realDate.getMinutes()), "s": timeFormat(realDate.getSeconds()), "q": Math.floor((realDate.getMonth() + 3) / 3), "S": realDate.getMilliseconds(), } if (!format) { format = "yyyy-MM-dd hh:mm:ss" } if( format == 'hh:mm' ){ return date.h+':'+date.m }else{ return date.h+':'+date.m } }else{ return false } } module.exports.getMax = getMax module.exports.formartTime = formartTime </wxs> 可在页面添加如下使用: m1.formartTime() m1.getMax()建立两个canvas标签,先绘制底层的浅灰色圆圈背景,再绘制上层的红色进度条。WXML代码
开始动态绘制
WXSS代码
特别注意:底层的canvas最好使用
z-index:-99;放置于底层
page { width: 100% height: 100% background-color: #fff
}.circle-box { text-align: center margin-top: 10vw
}.circle { position: absolute left: 0 right: 0 margin: auto
}.draw_btn { width: 35vw position: absolute top: 33vw right: 0 left: 0 margin: auto border: 1px #000 solid border-radius: 5vw
}
JS代码
//获取应用实例var app = getApp()var intervalvar varNamevar ctx = wx.createCanvasContext('canvasArcCir')
Page({ data: {
}, drawCircle: function () {
clearInterval(varName) function drawArc(s, e) {
ctx.setFillStyle('white')
ctx.clearRect(0, 0, 200, 200)
ctx.draw() var x = 100, y = 100, radius = 96
ctx.setLineWidth(5)
ctx.setStrokeStyle('#d81e06')
ctx.setLineCap('round')
ctx.beginPath()
ctx.arc(x, y, radius, s, e, false)
ctx.stroke()
ctx.draw()
}var step = 1, startAngle = 1.5 * Math.PI, endAngle = 0 var animation_interval = 1000, n = 60 var animation = function () { if (step