4-微信小程序开发(小程序默认页面函数说明)
https://www.cnblogs.com/yangfengwu/p/11601299.html
首先说一下,怎么让自己的一个项目更改名字成为一个新的项目


然后用软件导入项目即可
注:如果没有改文件里面的那个"projectname": "lesson3", ,用软件打开的时候,你会发现

这个地方还会显示lesson2,所以一定要按照上面两步修改完再导入工程,
如果没有修改文件里面那个"projectname": "lesson3" 只修改文件夹名字就导入,会发现后期无论怎么修改"projectname": "lesson3" 左上角照样显示原来的工程名字
你需要,删除工程文件,关闭微信开发软件,打开微信开发软件


然后重新复制一份工程,按照上面的提示修改文件夹名称和那个文件里面的工程名字,重新导入即可
本来这节想着做自己的页面,然后跳转查看,不过呢!我感觉还是给大家详细的说一下,小程序当前的页面
主要讲解这里面的函数

这里面代码少些,好讲,,,讲完以后大家完全可以举一反三,看另一个文件的代码

是在 注:这个知道就好,不是这节的重点哈.....我只是让大家知道怎么进来 logs页面的


实际上是微信提供的方法 注:这个知道就好,不是这节的重点哈.....我只是让大家知道怎么进来 logs页面的


注:这个知道就好,不是这节的重点哈.....我只是让大家知道怎么进来 logs页面的
现在看

每个页面里面都有 data:{ 这里面放各种数据 } 源代码是放了一个数组
现在看怎么使用这个数组
//logs.js
const util = require('../../utils/util.js') Page({
data: {
logs: []
},
onLoad: function () {//页面加载的时候条用 this.data.logs[] = "";//数组赋值
console.log(this.data.logs[]);//打印数组的值 this.setData({
logs: (wx.getStorageSync('logs') || []).map(log => {
return util.formatTime(new Date(log))
})
})
}
})


大家可能不习惯 this.XXXX 习惯了 JS 其实可以


data 里面的数据就是用 this.data.XXXX赋值和调用哈
咱怎么让变量显示在页面上呢,现在说一下,这个家伙


<!--logs.wxml-->
<view class="container log-list"><!--布局方式采用container 和 log-list--> <text>{{qqqqqqqq}}</text><!--加个文本显示 js文件this.setData({ qqqqqqqq:XXXX }) XXXX就是text的显示内容--> <block wx:for="{{logs}}" wx:for-item="log">
<text class="log-item">{{index + }}. {{log}}</text>
</block>
</view>
注意 凡是显示的变量用 {{ 放变量名 }} 变量名在 JS中 用 this.SetData({ 变量名:XXXXX }) XXXXX就是控件显示的内容

//logs.js
const util = require('../../utils/util.js') var GlobalValueStr = "测试页面的显示信息1111111111" Page({
data: {
logs: [], //data里面定义数据全部按照json格式
str: "测试页面的显示信息222222222"
},
onLoad: function () {//页面加载的时候条用
this.setData({
qqqqqqqq:"显示一下哈让我看看"
}) this.setData({
logs: (wx.getStorageSync('logs') || []).map(log => {
return util.formatTime(new Date(log))
})
})
}
})

现在让它显示JS变量里面的值


因为 onLoad 函数里面有 this.setData 了,所以咱合成一个

现在学一个知识点

这个应该都知道吧,,,如果JS的函数没有学过,先去百度 JS基础教程哈......
咱看下一个


不要变了模样就不认识了
好下一个知识点

但是我要是想给数组每一个数据都开平方呢????
难道

要是数组很大呢.....用 map

使用是 数组.map(调用一个带形参计算函数,形参就是数组的每一个值)
举个例子: 所有的数据都 除以2

当然也可以

再看个知识点

<!--logs.wxml-->
<view class="container log-list"><!--布局方式采用container 和 log-list--> <!--https://developers.weixin.qq.com/miniprogram/dev/reference/wxml/list.html
默认数组的当前项的下标变量名默认为 index,数组当前项的变量名默认为 item
-->
<block wx:for="{{temptemp}}">
<text>{{index + }}号下标值: {{item}}</text>
</block> <block wx:for="{{logs}}" wx:for-item="log">
<text class="log-item">{{index + }}. {{log}}</text>
</block>
</view>

//logs.js
const util = require('../../utils/util.js') var GlobalValueStr = "测试页面的显示信息1111111111"
var temp = [,,,]; function fun(value){
return value/;
}
var funst = value=>{
return value;
} Page({
data: {
logs: [], //data里面定义数据全部按照json格式
str: "测试页面的显示信息222222222"
},
onLoad: function () {//页面加载的时候条用 temp = temp.map( value => { return value/ } ); console.log( temp ); this.setData({
qqqqqqqq: GlobalValueStr, temptemp: temp, logs: (wx.getStorageSync('logs') || []).map( log => { return util.formatTime( new Date(log) ) } ) })
}
})


注意一件事情哈

然后看

最后看

我修改下哈

注意: 他俩才是真爱!!!!

然后接着看

最后看



然后调取打印

还有最后一个,访问APP.JS里面的变量
定义了一些变量

其实访问这里的变量只需要


说的挺多的.....先喝口水.
https://www.cnblogs.com/yangfengwu/p/11618962.html
4-微信小程序开发(小程序默认页面函数说明)的更多相关文章
- 【Linux程序设计】之Linux库函数的使用,多文件程序开发,静态与共享函数
这个系列的博客贴的都是我大二的时候学习Linux系统高级编程时的一些实验程序,都挺简单的.贴出来纯粹是聊胜于无. 实验题目:Linux基础程序设计综合实验 实验目的:熟悉并掌握Linux库函数的使用, ...
- 微信小程序开发06-一个业务页面的完成
前言 接上文:微信小程序开发05-日历组件的实现 github地址:https://github.com/yexiaochai/wxdemo 这里来说一说我们的理念,我们也学习小程序开发有一周多了,从 ...
- 微信小程序开发8-小程序的宿主环境(1)
1.小程序的运行环境分成渲染层和逻辑层,第2章提到过 WXML 模板和 WXSS 样式工作在渲染层,JS 脚本工作在逻辑层.小程序的渲染层和逻辑层分离是经过很多考虑得出来的模型 2. 1.渲染层和数据 ...
- 微信小程序开发3-小程序的代码组成
1.小程序由配置代码JSON文件.模板代码 WXML 文件.样式代码 WXSS文件以及逻辑代码 JavaScript文件组成 2.JSON: (JavaScript Object Notation) ...
- 微信小程序开发——以简单易懂的浏览器页面栈理解小程序的页面路由
前言: 对于小程序的页面路由,如果没有一定开发经验的话,理解起来还是会有些困难的.哪怕是有一定小程序开发经验的开发者,能够完全理解掌握的恐怕也不多. 这里就以另外一种方式来详细的介绍小程序的页面栈及路 ...
- 小程序开发-小程序tabBar不显示的原因分析
在尝试小程序开发时,tabBar这个是个非常常见的组件,但是今天在进行开发时,设置了TabBarb并没有显示,被这个问题困扰了近半小时,现在将排查问题后所得到的经验记录下来. 首先 如果tabBar不 ...
- 5-微信小程序开发(小程序页面跳转和布局说明)
https://www.cnblogs.com/yangfengwu/p/11605209.html 新建一个小程序 咱现在新建个页面 在pages 上右击,选择新建目录 会自动添加这几个文件 现在做 ...
- Android4.0+锁屏程序开发——设置锁屏页面篇
[如何开发一个锁屏应用] 想要开发一个锁屏应用,似乎很难,其实并没有想象中那么难. 从本质上来说,锁屏界面也只是一个Activity而已,只是这个界面比较特殊,在我们点亮屏幕的时候,这个界面就会出现. ...
- 微信小程序开发02-小程序基本介绍
前言 前面我们研究了下微信小程序的执行流程,因为拿不到源码,只能算我们的猜想,我们需要更加了解小程序还需要做具体的项目,于是我们将原来那套还算复杂的业务拿出来: [组件化开发]前端进阶篇之如何编写可维 ...
- 微信小程序开发01-小程序的执行流程是怎么样的?
前言 我们这边最近一直在做基础服务,这一切都是为了完善技术体系,这里对于前端来说便是我们需要做一个Hybrid体系,如果做App,React Native也是不错的选择,但是一定要有完善的分层: ① ...
随机推荐
- select中的option被选中时页面的跳转
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 【题解】Luogu P1357 花园
原题传送门 我们先将花圃断环为链,并将\([1,m]\)复制一份到\([n+1,n+m]\),最后要求\([1,n+m]\)是合法序列且\([1,m]\)与\([n+1,n+m]\)相等的序列的数量即 ...
- python鸭子类型
“当看到一只鸟走起来像鸭子.游泳起来像鸭子.叫起来也像鸭子,那么这只鸟就能够被称为鸭子” python的鸭子类型的设计让python的诸多对象的分类和应用更加灵活,需要注意类型和对象的区别(pytho ...
- MOOC C#笔记(一):数据类型
C#笔记 基础知识 一个C#程序主要包括以下部分: 命名空间声明(Namespace declaration) 一个 class Class 方法 Class 属性 一个 Main 方法 语句(Sta ...
- oracle学习笔记(三)
索引: drop table test1 purge; drop table test2 purge; drop table test3 purge; drop table t purge; crea ...
- C# vb .net实现装饰边框效果滤镜
在.net中,如何简单快捷地实现Photoshop滤镜组中的装饰边框效果呢?答案是调用SharpImage!专业图像特效滤镜和合成类库.下面开始演示关键代码,您也可以在文末下载全部源码: 设置授权 第 ...
- 刷脸支付袭来,WeChat Pay & AliPay争宠,究竟谁能笑到最后?
移动支付的快速发展,让我们摆脱了对现金的依赖,即使我们出门忘记带现金,那也没关系,我们照样可以通过手机来完成支付.现如今无论是大商场.还是水果摊都支持二维码付款,这也就意味着智慧化的生活正在一步步地向 ...
- mysql性能优化之服务器参数配置-内存配置
MySQL服务器参数介绍 MySQL获取配置信息路径 命令行参数 mysqld_safe --datadir=/data/sql_data 配置文件 mysqld --help --verbose | ...
- 18.centos7基础学习与积累-004-分区理论
1.从头开始积累centos7系统运用 大牛博客:https://blog.51cto.com/yangrong/p5 1.常规分区:数据不是特别重要的业务(集群的某个节点) /boot 引导分区 ...
- Eclipse经常出现未响应问题
修改eclipse.ini文件 -startupplugins/org.eclipse.equinox.launcher_1.5.0.v20180512-1130.jar--launcher.libr ...