小程序和PHP学习笔记 ----- 不定期更新。
学习tp5和小程序过程需要记住的重点记录
1,box-sizing: border-box; 规定两个并排的带边框的框 border-box 为元素设定的宽度和高度决定了元素的边框盒。 就是说,为元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制。
2,border-right: 1rpx solid #d9d9d9; /右边框样式:厚度,实线,颜色/
3,flex-flow属性是flex-direction属性和flex-wrap属性的简写形式,默认值为row nowrap。
4,在.wxml文件的通过data-* 传值,后台通过e.currentTarget.dataset.*取值。 在循环出来的界面中,不同的界面可触发不同点击事件
<view class='btnimg' wx:for="{{imgTaps}}" wx:key="" bindtap="aaa" data-id='{{item.id}}'></view>
aaa: function (e) {
console.log(e.currentTarget.dataset.id);
}
5,微信小程序跳转传参
一般都是传字符串到下一页,如果要想传对象怎么办呢? 解决办法是先将对象转换为json字符串然后到下个页面将json字符串,再转化为对象。如下:
let str=JSON.stringify(e.currentTarget.dataset.item);
wx.navigateTo({
url: '/跳转路径/?jsonStr='+str,
})
另一个页面加载
onLoad:function(options){
// 生命周期函数--监听页面加载
let item=JSON.parse(options.jsonStr);
this.setData({ward:item});
},
6, 表单提交需要 如果遇到多字段怎么办?(以小程序为例)
解决办法:获取全部的字段value 定义一个data(变量来存);定义一个数组arr 存放需要验证的字段 在需要验证的时候 用for of 来循环遍历value判断是否存在 (注意:for-of遍历value for-in遍历key)
//表单提交
formSubmit: function(e) {
let data = e.detail.value;//定义一个变量来存放字段value
let type = 1;//后端需要的类型
let c_type = parseInt(this.data.c_type) + 1;//文字转数字后加一 与后端类型对应
let latitude = this.data.latitude;
let longitude = this.data.longitude;
var openid = wx.getStorageSync('userid'); //获取缓存的openid
var details_img = this.data.imgCourseStr;//拼接图片路径为字符串 给后端传递
var cover = this.data.coverImgstr;//拼接图片路径为字符串 给后端传递 data.details_img = details_img;
data.cover = cover;
data.lng = longitude; //把获取到 data的longitude存到当前的data里
data.lat = latitude
data.teacher_id = openid, data.c_type = c_type;
data.type = type;
console.log(data)
// return let arr = ['nid', 'title', 'present', 'details_img', 'cover', 'start_time', 'exit_time', 'start_num', 'money', 'class_start_time', 'class_exit_time','class_time', 'c_type', 'c_address', 'c_number', 'c_money'];
for (let item of arr) {
// of item == value
// in item == key
if (data[item] == '') {
wx.showLoading({
title: '必填项未填',
})
setTimeout(function() {
wx.hideLoading()
}, 2000)
return
}
}
//等待区的地点
this.submit(data).then((data) => {
//这里是等待区 银行业务员已经帮你处理完成 并将处理结果告诉你了
wx.showLoading({
title: '成功',
})
setTimeout(function() {
wx.hideLoading();
wx.reLaunch({
url: '/pages/index/index',
})
}, 2000)
})
},
7,理解重绘和回流
重绘:只操作改变dom节点的样式属性,性能比回流好
回流:操作dom节点,会重新编译执行,内存消耗较大
8,git 更改文件后重新提交到远程仓库
执行 git add . 命令 添加更改过的文件到本地仓库
然后 执行 git commit -m "注释" 提交 覆盖
最后 执行 git push -u origin master 把文件提交到远程仓库
小程序和PHP学习笔记 ----- 不定期更新。的更多相关文章
- 微信小程序开发:学习笔记[3]——WXSS样式
微信小程序开发:学习笔记[3]——WXSS样式 快速开始 介绍 WXSS(WeiXin Style Sheets)是一套用于小程序的样式语言,用于描述WXML的组件样式,也就是视觉上的效果. WXSS ...
- 微信小程序开发:学习笔记[2]——WXML模板
微信小程序开发:学习笔记[2]——WXML模板 快速开始 介绍 WXML 全称是 WeiXin Markup Language,是小程序框架设计的一套标签语言,结合小程序的基础组件.事件系统,可以构建 ...
- 微信小程序开发:学习笔记[7]——理解小程序的宿主环境
微信小程序开发:学习笔记[7]——理解小程序的宿主环境 渲染层与逻辑层 小程序的运行环境分成渲染层和逻辑层. 程序构造器
- 微信小程序开发:学习笔记[5]——JavaScript脚本
微信小程序开发:学习笔记[5]——JavaScript脚本 快速开始 介绍 小程序的主要开发语言是 JavaScript ,开发者使用 JavaScript 来开发业务逻辑以及调用小程序的 API 来 ...
- 微信小程序开发:学习笔记[4]——样式布局
微信小程序开发:学习笔记[4]——样式布局 Flex布局 新的布局方式 在小程序开发中,我们需要考虑各种尺寸终端设备上的适配.在传统网页开发,我们用的是盒模型,通过display:inline | b ...
- 微信小程序开发:学习笔记[1]——Hello World
微信小程序开发:学习笔记[1]——Hello World 快速开始 1.前往微信公众平台下载微信开发者工具. 地址:https://mp.weixin.qq.com/debug/wxadoc/dev/ ...
- 微信小程序开发:学习笔记[9]——本地数据缓存
微信小程序开发:学习笔记[9]——本地数据缓存 快速开始 说明 本地数据缓存是小程序存储在当前设备上硬盘上的数据,本地数据缓存有非常多的用途,我们可以利用本地数据缓存来存储用户在小程序上产生的操作,在 ...
- 微信小程序开发:学习笔记[8]——页面跳转及传参
微信小程序开发:学习笔记[8]——页面跳转及传参 页面跳转 一个小程序拥有多个页面,我们可以通过wx.navigateTo推入一个新的页面.在首页使用2次wx.navigateTo后,页面层级会有三层 ...
- 2019年高校微信小程序开发大赛学习笔记
学做小程序(学堂在线笔记)一.传统布局 text-align:center //水平居中 margin-bottom: 60px //设置间距 二.弹性盒子布局 display:flex; flex- ...
随机推荐
- ArcEngine不同种类的工作空间建立查询ICursor时“超出系统资源”
环境 这里我的工作空间有两种:mdb库和SDE库分别打开的工作空间. 查询语句:使用Field in ('1','2')查询方式来得到游标对象. 错误 当查询语句中in后面的条件值大于1500时,在I ...
- ng4 路由多参数传参以及接收
import { Router } from '@angular/router'; constructor( private router:Router, ) { } goApplicationDet ...
- JQuery Mobile - 动态修改select选择框的选中项
<label for="day">选择天</label> <select name="day" id="day" ...
- maya2017卸载/安装失败/如何彻底卸载清除干净maya2017注册表和文件的方法
maya2017提示安装未完成,某些产品无法安装该怎样解决呢?一些朋友在win7或者win10系统下安装maya2017失败提示maya2017安装未完成,某些产品无法安装,也有时候想重新安装maya ...
- HTML+CSS实现页面豆腐块布局和图片居中
<!DOCTYPE html> <html> <head lang="en"> <meta http-equiv="Conten ...
- 1,rocketmq 的原理与安装教程
参考文档 http://blog.csdn.net/a19881029/article/details/34446629 https://github.com/alibaba/RocketMQ htt ...
- Spring Boot整合 Thymeleaf 模板引擎
什么是Thymeleaf Thymeleaf是一款用于渲染XML.XHTML.HTML5内容的模板引擎.类似Velocity,FreeMaker模板引擎,它也可以轻易的与Spring MVC等Web框 ...
- [EXP]Memu Play 6.0.7 - Privilege Escalation
# Exploit Title: Memu Play - Privilege Escalation (PoC) # Date: // # Author: Alejandra Sánchez # Ven ...
- 11.10 vue
https://vuejs.org/js/vue.js ide typora v-pre 指令 vuex text script . 语法 BCF 终端输入 node -v npm -v 包管理 ...
- 使用SonarCloud对.NET Core项目进行静态代码分析
本文将介绍如何使用SonarCloud进行.NET Core项目的静态代码分析.SonarCloud是SonarQube提供的基于云的版本,特别针对于开源项目是免费的. 首先,在sonarcloud. ...