学习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学习笔记 ----- 不定期更新。的更多相关文章

  1. 微信小程序开发:学习笔记[3]——WXSS样式

    微信小程序开发:学习笔记[3]——WXSS样式 快速开始 介绍 WXSS(WeiXin Style Sheets)是一套用于小程序的样式语言,用于描述WXML的组件样式,也就是视觉上的效果. WXSS ...

  2. 微信小程序开发:学习笔记[2]——WXML模板

    微信小程序开发:学习笔记[2]——WXML模板 快速开始 介绍 WXML 全称是 WeiXin Markup Language,是小程序框架设计的一套标签语言,结合小程序的基础组件.事件系统,可以构建 ...

  3. 微信小程序开发:学习笔记[7]——理解小程序的宿主环境

    微信小程序开发:学习笔记[7]——理解小程序的宿主环境 渲染层与逻辑层 小程序的运行环境分成渲染层和逻辑层. 程序构造器

  4. 微信小程序开发:学习笔记[5]——JavaScript脚本

    微信小程序开发:学习笔记[5]——JavaScript脚本 快速开始 介绍 小程序的主要开发语言是 JavaScript ,开发者使用 JavaScript 来开发业务逻辑以及调用小程序的 API 来 ...

  5. 微信小程序开发:学习笔记[4]——样式布局

    微信小程序开发:学习笔记[4]——样式布局 Flex布局 新的布局方式 在小程序开发中,我们需要考虑各种尺寸终端设备上的适配.在传统网页开发,我们用的是盒模型,通过display:inline | b ...

  6. 微信小程序开发:学习笔记[1]——Hello World

    微信小程序开发:学习笔记[1]——Hello World 快速开始 1.前往微信公众平台下载微信开发者工具. 地址:https://mp.weixin.qq.com/debug/wxadoc/dev/ ...

  7. 微信小程序开发:学习笔记[9]——本地数据缓存

    微信小程序开发:学习笔记[9]——本地数据缓存 快速开始 说明 本地数据缓存是小程序存储在当前设备上硬盘上的数据,本地数据缓存有非常多的用途,我们可以利用本地数据缓存来存储用户在小程序上产生的操作,在 ...

  8. 微信小程序开发:学习笔记[8]——页面跳转及传参

    微信小程序开发:学习笔记[8]——页面跳转及传参 页面跳转 一个小程序拥有多个页面,我们可以通过wx.navigateTo推入一个新的页面.在首页使用2次wx.navigateTo后,页面层级会有三层 ...

  9. 2019年高校微信小程序开发大赛学习笔记

    学做小程序(学堂在线笔记)一.传统布局 text-align:center //水平居中 margin-bottom: 60px //设置间距 二.弹性盒子布局 display:flex; flex- ...

随机推荐

  1. [UWP]不那么好用的ContentDialog

    ContentDialog是UWP开发中最常用的组件之一,一个体验良好的UWP应用很难避免不去使用它.博客园里也有许多的文章介绍如何来利用ContentDialog实现各种自定义样式的弹窗界面.不过实 ...

  2. springmvc接受及响应ajax请求。 以及@RequestBody 和@ResponseBody注解的使用

    1.发送ajax请求 $.ajax({ url:"user/testAjax", contentType:"application/json;charset=UTF-8& ...

  3. CentOS 解决vim乱码问题

    今天在服务器安装了任务调度工具(TaskCTL) 发现是乱码的,看了官方文档说的办法也没有处理成功,可能由于他们已经有一段时间没有维护这个版本了.(以前提供的免费版本) 后来发现CentOS的Vim的 ...

  4. moment.js 学习笔记

    一.安装 / 使用 npm install moment 注:使用版本为 2.22.2 var moment = require('moment'); moment().format(); // 20 ...

  5. LeetCode--No.002 Add Two Numbers

    Add Two Numbers Total Accepted: 160702 Total Submissions: 664770 Difficulty: Medium You are given tw ...

  6. Liferay7 BPM门户开发之23: 了解内置工作流(Kaleo Workflow)

    Liferay内置的工作流是企业版的功能,虽然简单粗糙,但依然不支持社区版.既然要用更强大的Activiti来替代它,那就非常有必要学习一下内置工作流的一些思想,以便借鉴. 它的特点: 实体的工作流操 ...

  7. 来了!阿里开源分布式事务解决方案 Fescar

    摘要: 阿里妹导读:广为人知的阿里分布式事务解决方案:GTS(Global Transaction Service),已正式推出开源版本,取名为“Fescar”,希望帮助业界解决微服务架构下的分布式事 ...

  8. .NET FileUpLoad上传文件

    一.上传扫描件到服务器,自定义创建文件夹(如果存在该文件夹,则无需创建),并判断格式以及文件大小进行保存: 首先创建一个保存按钮事件: protected void btnSave_Click(obj ...

  9. python-UiAutomator学习&使用

    一.安装 源码地址: https://github.com/xiaocong/uiautomator#basic-api-usages ①下载zip包,解压到本地目录下 ②进入对应目录下,执行 $su ...

  10. 全网最详细的IDEA、Eclipse和MyEclipse之间于Java web项目发布到Tomcat上运行成功的对比事宜【博主强烈推荐】【适合普通的还是Maven方式创建的】(图文详解)

    不多说,直接上干货! IDEA [适合公司业务]全网最详细的IDEA里如何正确新建[普通或者Maven]的Java web项目并发布到Tomcat上运行成功[博主强烈推荐](类似eclipse里同一个 ...