- 博客(39)
- 收藏
- 关注
RSS订阅原创 微信小程序（路由及组件跳页传参）
课程大纲（1）API路由跳页传参（2）navigator导航组件跳页传参API路由跳页传参商品列表展示页商品展示页编写回到商城列表展示页，如果跳页时直接传参，会发现黄色警告，无法跳页小程序事件传递参数小程序事件传递参数在小程序中，给元素绑定事件不能直接传递参数，如果写成正解：①给元素绑定自定义属性data-item=”{{item}}”②在js中通过事...
2019-11-29 10:58:24
340
原创 微信小程序（组件跳转、规范、层级准备）
课程大纲（1）路由API跳转小结（2）hover样式（3）navigator导航组件跳转（4）路由跳转规范（5）页面层级准备前言首先简单回顾下路由API跳转:wx.navigateTowx.navigateBackwx.redirectTowx.switchTabwx.reLaunchDOM的API：document.createElement除了使用路由API进行页...
2019-11-29 10:51:45
903
原创 微信小程序（页面栈和API跳转）
课程大纲（1）数据操作限制补充（2）页面栈（3）API页面跳转—router路由APIwx.navigateTowx.navigateBackwx.redirectTowx.switchTabwx.reLaunch数据操作限制针对上节所讲的程序注册器与页面注册器，简单做下补充，即页面数据data的操作限制（1）直接修改Page实例的this.data而不调用this.s...
2019-11-29 10:14:57
491
原创 微信小程序（页面用户行为）
课程大纲（1）页面构造/注册器Page()（2）页面注册器参数data初始化数据页面生命周期页面用户行为其他（3）页面用户行为前言注册页面：对于小程序中的每个页面，在页面对应的 page.js 文件中调用 Page 方法注册页面示例作用：指定页面的初始数据、生命周期回调、事件处理函数等。页面的用户行为：小程序宿主环境提供了四个和页面相关的用户行为回调页面构造/注...
2019-11-27 19:48:12
527
原创 微信小程序（页面生命周期）
课程大纲（1）页面构造/注册器Page()（2）页面注册器参数data初始化数据页面生命周期页面用户行为（3）页面生命周期及顺序小结：①小程序注册App()②页面注册Page()前言注册页面：对于小程序中的每个页面，在页面对应的 page.js 文件中调用 Page 方法注册页面示例作用：指定页面的初始数据、生命周期回调、事件处理函数等。页面的生命周期：...
2019-11-27 19:30:43
1101
原创 微信小程序（小程序生命周期、运行机制、场景值）
课程大纲（1）程序构造/注册器App()（2）小程序生命周期（3）小程序运行机制（4）scene场景值体验版特定页面设置体验人员扫描二维码进入时有时进入的不是首页？？？方案：登录小程序后台，重新设置体验版打开时的特定页面路径，更换为当前首页即可程序构造/注册器App()注册器/构造器分类：小程序级别：App-----程序构造器/注册器页面级别：Page------...
2019-11-27 19:14:29
234
原创 微信小程序（逻辑层与程序注册构造器）
课程大纲（1）小程序逻辑层 App Service（APP服务）（2）ServiceWorker（3）web worker（4）程序构造/注册器App()前言逻辑层 App Service（APP服务）小程序开发框架的逻辑层使用 JavaScript 引擎为小程序提供开发者 JavaScript 代码的运行环境以及微信小程序的特有功能。逻辑层将数据进行处理后发送给视图层，同时接...
2019-11-27 18:58:45
344
原创 git与码云，工作必备
前言目前国内开发人员普遍都开始使用 Git 进行项目的版本管理课程大纲（1）Git 介绍，Git 作用，Git 工作流程（2）Windows 环境和 Linux 环境下安装 Git（3）码云常用操作（4）Git 常用命令操作（5）Git 分支命令操作Git 简介Git 的创始人同时也是 Linux 的创始人 Linus。Linus 早期在维护 Liunx 代码一直是人肉合并...
2019-11-26 19:39:05
113
原创 微信小程序（跳页之tabBar导航跳转）
tabBar小程序导航简介：小程序是一个多tab标签应用（客户端窗口的底部或顶部有tab栏可以切换页面），可以通过Tabbar配置项指定tab栏的表现，以及tab切换时显示的对应页面。小程序根目录下的 app.json 文件用来对微信小程序进行全局配置在小程序配置文件里面可以设置tabBar属性：先来个简单案例看下效果 "tabBar": { "list": [ ...
2019-11-25 16:21:17
499
原创 微信小程序（小程序模型与宿主环境）
课程大纲（1）小程序模型（2）模型基本工作方式（3）数据驱动（4）通信模式（5）WebView(承载网页的容器。会自动铺满整个小程序页面，个人类型的小程序暂不支持使用。)（6）JsCore（7）宿主环境前言小程序可以调用宿主环境/微信提供的微信客户端的能力，这就使得小程序比普通网页拥有更多的能力(扫一扫、摇一摇)。小程序的运行环境分成渲染层和逻辑层， WXML 模板文件和 W...
2019-11-25 15:52:51
745
原创 AJAX之模板引擎&&字符串模板x-template
前言在js里面，经常需要使用js往页面中插入html内容写过一点前端的都会碰到需要使用JS字符串拼接HTML元素然后append到页面DOM树上的情况。一般的写法都是使用+号以字符串的形式拼接，如果html很短还好说，但是遇到描述里面的这么大段，直接用字符串存储会很困难，因为不光要处理单引号，还需要很多「+」号把字符串一个个连接起来，十分的不方便。比如有的时候需要使用弹出框的时候手动使用字...
2019-11-23 16:26:59
372
原创 微信小程序（JS逻辑文件）
课程大纲（1）业务逻辑案例（2）调用API案例（3）ECMAScript----（4）小程序执行环境（5）模块化（6）作用域与全局变量前言前言：一个服务仅仅只有界面展示是不够的，还需要和用户做交互：响应用户的点击、获取用户的位置等等。在小程序里边，通过编写脚本文件来处理用户的操作。小程序的主要开发语言是 JavaScriptJS 作用：①开发者使用 JS来开发...
2019-11-22 18:51:32
2246
原创 微信小程序（布局适配与物理逻辑像素）
前言移动端开发经常遇到一些概念：物理像素、逻辑像素、像素密度、像素比等，本节来详细介绍下关键词：屏幕尺寸、物理像素/屏幕分辨率/物理分辨率、逻辑像素DIP、像素密度PPI、像素比DPR、视网膜显示屏Retina、rpx、vw、vh等。屏幕尺寸华为荣耀7上图写的是5英寸。那么这个5英寸到底是怎么算出来的呢？先进行一下单位的换算1英寸（inch）=2.54厘米（cm）屏...
2019-11-21 18:48:32
455
原创 微信小程序（WXSS样式文件）
课程大纲（1）WXSS简介（2）分类（3）尺寸单位rpx（4）样式导入@import（5）style内联样式（6）WXSS选择器（7）开发工具设置WXSS简介简介：WXSS（WeiXin Style Sheets）是一套用于小程序的样式语言，用于描述WXML的组件样式，也就是视觉上的效果。对比：WXSS与Web开发中的CSS类似。为了更适合小程序开发，WXSS对CSS...
2019-11-21 17:09:05
1642
原创 微信小程序（WXML模板文件二）
课程大纲（1）循环指令key属性补充（2）wx:if条件变异指令（3）<block>标签（4）hidden隐藏元素（5）模板（6）引用（7）共同属性循环指令key属性补充Vue和React框架用遍历指令时的key值不建议用index（1）key值在没有删除插入操作时只要是唯一值也无所谓，即此时为index索引也可以（2）如果有删除或者插入的操作，后一位会继...
2019-11-21 16:54:05
129
原创 AJAX之JSON与JSONP
前言AJAX目前常问的两个面试题1、AJAX以何种格式来交换数据？2、跨域的需求如何解决？这两个问题目前都有不同的解决方案，比如数据可以用自定义字符串来描述，跨域可以通过服务器端代理来解决。JSON&&JSONPJSON和JSONP虽然只有一个字母的差别，但本质差距较大：1、JSON是一种数据交换格式2、而JSONP是开发人员创造出的一种非官方跨域数据交互协议...
2019-11-20 20:24:41
144
原创 AJAX之jQuery操作&&全局处理程序
jQuery之AJAX日常开发里为了提高开发效率，一般会使用框架中的AJAX语法，例如经常使用的jQuery，也给我们封装好了AJAX的一些语法操作，而且jQuery也封装了JSONP跨域。几种常用的方式$.ajax，$.post， $.get， $.getJSONjQuery之$.ajax1、$.ajax$.ajax是JQuery对ajax封装的最基础，通过使用这个函数可以完成...
2019-11-20 20:14:41
564
原创 AJAX之封装+跨域
AJAX5步法先简单回顾下之前所说的5步法1、创建异步对象XMLHttpRequest/* 1.创建 XMLHttpRequest一步对象*/ var xhr; if (window.XMLHttpRequest) { xhr = new XMLHttpRequest(); /* 主流浏览器 */ } else { xhr = new ActiveXOb...
2019-11-16 16:38:43
406
原创 AJAX之状态值+状态码+HTTP请求
HTTP请求HTTP简介http是计算机通过网络进行通信的规则，使浏览器去服务器请求信息和服务。HTTP是一种无状态协议（他可以自己保存东西cookie）：无状态指的是不建立持久的连接，即服务端不保留连接的相关信息，即断开请求和响应后是没有记忆的。HTTP请求是一步完成的吗？—NOHTTP请求步骤一个完整的HTTP请求过程，通常包含以下7个步骤（1）建立TCP连接（2）WEB...
2019-11-15 18:06:18
120
原创 AJAX请求5步法
课程大纲（1）AJAX请求步骤(初版)（2）AJAX请求类型（3）跨域+CORS+Network（4）JSON序列化与反序列化/解析（5）AJAX请求步骤(微调)首先来一段五步法的全部完整代码，下面再对代码一一进行详细介绍，代码如下：这是naonao.text的代码： [ {"name":"佳佳","age":8}, {"name":"慧慧","age":5}, {"na...
2019-11-15 16:34:49
254
原创 AJAX简介与原理
关联网址（1）聚合数据https://www.juhe.cn/docs/api/id/39—天气（2）JSON API免费接口http://www.bejson.com/knownjson/webInterface/课程大纲（1）AJAX简介（2）AJAX应用案例（3）传统验证方式（4）AJAX验证方式（5）AJAX通俗理解+工作方式ajax简介（1）什么是AJAX？...
2019-11-14 19:39:56
335
原创 面试问：AJAX+ML+DTD概念
课程大纲（1）ajax简介（2）XML简介（3）SGML简介（4）DTD简介（5）HTML与DTD（6）为什么需要DTD声明？（7）DTD作用（8）标准模式(strict mode)和怪异模式(quirks mode)（9）HTML5文档声明（10）什么是 XHTML？（11）XHTML对比HTML（12）对比GML、SGML、HTML、XML、XHTML、HTML5...
2019-11-14 19:22:24
116
原创 微信小程序的数据绑定和页面的跳转
数据绑定一、微信小程序的数据绑定方式：微信小程序提供了以下两种数据绑定方式：1、利用初始化数据进行数据绑定：将数据书写在Page({data:{}})中。绑定的数据可以在AppData面板中进行查看。2、使用setData()方法做数据绑定：这也被称为“数据更新”，这样的数据更新将引起页面 的再次渲染。（1）该方法的使用需要卸载 onLoad()函数中。（2）可以利用一个普通变量...
2019-11-13 16:20:46
891
原创 微信小程序基础组件
一、视图容器（View Container）1、<view></view>功能：基本视图容器，类似于页面开发时的<div></div>标记对。2、<swiper></swiper>功能：滑动视图容器，用于实现轮播图效果。结构：一个swiper组件由多个swiper-item组成。<swiper>...
2019-11-13 16:15:20
579
原创 微信小程序（WXML模板文件一）
今日大纲（1）页面根元素（2）WXML简介（3）标签闭合、敏感性（4）数据驱动（5）数据绑定{{}}—{{}}（6）列表渲染v-for----wx:for页面根元素根元素page每一个页面都具备一个根元素：<page></page>页面根元素可以在控制台的WXML选项卡中看到允许在wxss文件中对page根元素进行样式设置简介全称：W...
2019-11-13 16:03:24
1082
原创 微信小程序（JSON配置文件）
认识微信小程序的目录结构一、根目录下的三个文件：1、app.js，必须，小程序逻辑文件。2、app.json，必须，小程序配置文件。3、app.wxss，全局公共样式文件。4、[pages]，用于存放页面文件的文件夹。5、[utils]，用于存放公共js的文件夹。二、微信小程序的页面：1、微信小程序是由若干个页面构成的。2、所有的页面内容必须存放在[pages]文件夹下。3、...
2019-11-13 15:24:47
1362
3
原创 微信小程序（开发工具、项目创建、发布审核、人员及目录结构分析）
课程大纲（1）账号申请（2）后台小程序信息完善（3）安装开发工具IDE（4）小程序项目搭建（5）项目编译（6）真机预览调试开发前准备小程序是一种全新的连接用户与服务的方式，它可以在微信内被便捷地获取和传播，同时具有出色的使用体验。小程序开发前准备：①申请账号②安装开发工具申请账号开发小程序之前需要先注册一个小程序账号，通过这个帐号你就可以管理你的小程序。账号申请：...
2019-11-12 19:06:00
462
原创 ES6之模板引擎&&字符串模板x-template
前言在js里面，经常需要使用js往页面中插入html内容写过一点前端的都会碰到需要使用JS字符串拼接HTML元素然后append到页面DOM树上的情况。一般的写法都是使用+号以字符串的形式拼接，如果html很短还好说，但是遇到描述里面的这么大段，直接用字符串存储会很困难，因为不光要处理单引号，还需要很多「+」号把字符串一个个连接起来，十分的不方便。比如有的时候需要使用弹出框的时候手动使用字...
2019-11-07 20:11:44
936
原创 Vue之全局API（全局操作set+delete）
全局API（1）什么是全局API？全局API并不在构造器里，而是先声明全局变量或者直接在Vue上定义一些新功能，Vue内置了一些全局API。通俗理解：就是在构造器外部用Vue提供的API函数来定义新的功能。（2）常用vue 的全局 API列表1、Vue.directive 自定义指令2、Vue.extend 扩展实例构造器3、全局操作Vue.set + Vue.delete4、V...
2019-11-06 19:49:13
575
原创 Vue之全局API（nextTick、filter、use）
全局API（1）什么是全局API？全局API并不在构造器里，而是先声明全局变量或者直接在Vue上定义一些新功能，Vue内置了一些全局API.通俗理解：就是在构造器外部用Vue提供的API函数来定义新的功能。（2）常用vue 的全局 API列表1、Vue.directive 自定义指令2、Vue.extend 扩展实例构造器3、全局操作Vue.set + Vue.delete4、V...
2019-11-06 18:58:37
379
原创 Vue之全局API（扩展实例构造器extend）
全局API（1）什么是全局API？全局API并不在构造器里，而是先声明全局变量或者直接在Vue上定义一些新功能，Vue内置了一些全局API，比如本节要介绍的指令Vue.directive通俗理解：就是在构造器外部用Vue提供的API函数来定义新的功能。（2）常用vue 的全局 API列表1、Vue.directive 自定义指令2、Vue.extend 扩展实例构造器3、全局操作V...
2019-11-04 18:06:36
569
原创 Vue之全局API（自定义指令directive）
课程大纲（1）全局API（2）自定义指令—起源（3）自定义指令—分类（4）自定义指令—注册（5）自定义指令—调用（6）自定义指令—生命周期钩子全局API（1）什么是全局API？全局API并不在构造器里，而是先声明全局变量或者直接在Vue上定义一些新功能，Vue内置了一些全局API，比如本节要介绍的指令Vue.directive通俗理解：就是在构造器外部用Vue提供的API...
2019-11-04 17:22:08
4831
5
原创 Vue之多元素组件过渡+动画封装
课程大纲（1）多元素过渡（2）多组件过渡（3）列表过渡（4）动画封装多元素过渡首先介绍下如何实现多元素过渡（1）利用条件编译指令v-if与v-else实现多元素内容切换.（2）接下来在内容切换基础上，添加过渡动画，例如渐隐渐现效果1、transition添加name属性命名2、设置过渡状态（3）状态管理测试后发现并没有过渡效果，分析原因Vue在多个元素切换过程中...
2019-11-04 16:48:37
894
原创 Vue文本渲染指令v-text
文本渲染指令：这里补充个vue基础指令v-text文本渲染指令，v-text取值为数据data中某项时，便以文本形式渲染到DOM中场景：如果想单纯展示vue对象中的数据，可以使用文本渲染指令v-text插值表达式{{}}对比v-text（1）是否显示虚拟DOM即virtual dom验证后发现两者渲染结果完全一样，页面元素也一样。区别：但是如果你把网速调的很慢会发现，“v-...
2019-11-04 16:14:37
877
原创 Vue对象：允许对组件的属性实现数据验证。
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script src="js/vue-2.6.9.min.js" type="text/javascript" charset="utf-8"></scri...
2019-11-01 20:38:20
612
原创 Vue组件需要注意的事项
Vue.js1、Vue的下载安装：Vue.js官网 | 学习 | 教程 | 安装。2、Vue.js的版本：2.6.10。3、Vue的第一个程序：Hello,World! var vm=new Vue({ el:‘#box’, data:{ message:‘Hello,World!’}});（1）vm：Vue实例，利用Vue构造函数/构造器创建...
2019-11-01 15:39:18
851
原创 Vue四则运算计算器
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script src="js/vue-2.6.9.min.js" type="text/javascript" charset="utf-8"></scri...
2019-11-01 14:02:55
1993
原创 Vue精品购物车
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" type="text/css" href="css/bootstrap.css" /> <script sr...
2019-11-01 11:40:52
125
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人