- 博客(68)
- 收藏
- 关注
RSS订阅原创 swiper 轮播图
动画上的一些效果indicator-dots：是否显示小圆点，默认为falseautoplay： 是否自动轮播interval：间隔时间多长duration： 动画时间circular：是否采用衔接滑动，也就是无缝滑动。vertical：是否纵向滑动，默认是横向滑动。display-multiple-items：同时显示的滑块数量，默认是1个。...
2020-07-31 13:48:14
190
原创 个人练习 倒计时 轮播图
倒计时html<!-- 倒计时 --> <div class="time"> <p>10:00场</p> <img src="./img/lightning.png"> <p>距离结束还有</p> <div class="time1"> <div id="hour"></div> <span&
2020-07-21 10:06:13
447
原创 注册百度地图开发者账户创建
§1 注册百度地图开发者账户与创建应用1.1 百度地图开放平台简介1.2 开发者账户的注册1.3 创建应用1.4 关于应用的几点说明1.4.1 AK1.4.2 备注信息1.4.3 设置1.4.4 用量查询1.1 百度地图开放平台简介百度地图开放平台面向广大政府、企业、互联网等开发者开放地图服务能力，开发者市场占有率达到75%，每天支撑近50万APP、网站应用运营。百度地图开放平台拥有六大基础地图服务开放能力：定位、影像、出行、轨迹、数据、分析，并将六大服务能力免费开放给开发者使用。百
2020-07-02 17:11:50
3815
原创 navigator的open-type跳转问题
navigator的open-type属性 可选值 ‘navigate’、‘redirect’、‘switchTab’，对应于wx.navigateTo、wx.redirectTo、wx.switchTab的功能open-type="navigate"等价于API的 wx.navigateTo 而wx.navigateTo的url是需要跳转的应用内非 tabBar 的页面的路径open-type="redirect"等价于API的 wx.redirectTo 而wx.redirectTo的url是需要跳
2020-06-29 09:43:22
2103
2
原创 uni-app 简单实现基本购物车
uni-app实现购物车加减数量，计算金额数量,选中/未选中 删除商品先看一下完整效果图 如下：<template> <view class="index container"> <!-- 商品内容 --> <!-- <detriment :detriment="detriment"></detriment> --> <view class="detriment display-flex justify
2020-06-03 16:31:24
7351
1
原创 uni-app-商品分类导航、 双向绑定
第一种方法<template> <view class="row navBox" :style="scrollHeiht"> <!-- 左侧一级分类列表 --> <scroll-view :scroll-top="scrollTopLeft" scroll-y class="leftNavBox col20-5 height-100"> <view class="leftNavItem py-20 text-center" v-for=
2020-05-28 09:48:50
1633
原创 Vue
Vue.js基础知识1.在官网上可以下载Vue.js可以在本地加载，也可以使用CDN（内容分发网络）加载。2、第一个Vue.js程序：var vm=new Vue({ el:‘#app’, data:{ //数据区 x:100, y:‘OK’}})<div id=”app”> <p>{{y}}</p&g...
2020-05-25 17:33:51
153
原创 Vant 框架
Toast 轻提示引入代码演示import { Toast } from 'vant';Vue.use(Toast);文字提示Toast('提示内容');加载提示Toast.loading({ mask: true, message: '加载中...'});成功/失败提示Toast.success('成功文案');Toast.fail('失败文案');自定义图标Toast({ text: '自定义图标', icon: 'like-o'});Toast(
2020-05-19 16:50:12
2611
原创 git 克隆下载及上传
先在系统里创建一个 项目文件夹 文件夹名字：gitscape（放在系统什么位置 随意 名字随意）gitscape（这个名字比较语义化）然后在这个文件夹里，在桌面右击鼠标 选中Git Bash Here 选项首先你要下载git，没有下载的，去看我前面一篇博客下载，下载好之后，再来看这个就好了...
2020-05-19 15:48:32
907
原创 git（分布式版本控制系统）+码云（代码托管平台）
git之前用过，但是都不怎么用，现在一下子让上传、下载，搞的是一脸懵，得研究了差不多一天吧，才整明白，在这里记一下，方便看，也方便还不熟悉的来看看。哪写的不对的，可以留言联系我。git简介git是一个开源的分布式版本控制系统，可以有效、告诉地处理从很小到非常大的项目版本管理。git 是 Linus Torvalds 为了帮助管理 Linux 内核开发而开发的一个开放源码的版本控制软件。git特点分布式相对于集中式的最大区别在于开发者可以提交到本地，开发者可以通过克隆/复制（git clone），
2020-05-19 14:35:59
192
原创 uni-app 和Vuex
Vue.js框架下的移动端 开发工具：HbuilderXuni-app基础知识1.利用开发工具HbuilderX创建一个uni-app项目路径：“文件”菜单 | 新建 | 项目 | 默认模板1、[pages]：存放页面的目录，里面的每一个文件夹就是一个页面。2、[static]：存放静态文件的目录，里面可以放置图片、字体等。3、App.vue：实现整个项目的生命周期。4、m...
2020-05-14 11:47:52
618
原创 uni-app
uni-app1.搭建环境上官网安装一下开发工具然后需要安装微信开发者工具 最好用最新的如果直接写app的话 可以安装模拟器 如果是mac 再安装Xcode 就可以双端然后用开发工具 创建一个模板运用了2.使用vuexuni-app已经内置vuex 不需要再安装了在根目录下新建store文件 在其目录创建index.jsimport Vue from "vue";import Vuex from "vuex";Vue.use(Vuex);import users from "./
2020-05-14 10:53:04
335
原创 element UI表格绑定动态数据与selection复选操作
element UI表格绑定动态数据与selection复选操作的坑案例介绍：此案例是要求完成对客户的批量删除功能，因为客户有多条数据所以要结合分页组件来实现，并且批量删除按钮默认是禁用的，当有数据被选中时变为可用状态。当的数据:data是一个动态数据时（分页功能导致），若表格具备selection列，且对当前操作的事件（例如selection-change）也具备对变量的操作时：表格的复选功能会执行两次。示例代码：<el-row> <el-col :span="
2020-05-09 23:15:45
3248
1
原创 Vue
（1）包管理工具与镜像：npm即node.js包管理工具的全称为node.js package manager，cnpm为淘宝镜像，一般同步频率为10分钟一次。cnpm与npm使用语法相同，区别在于服务器。（2）注册语法为在components选项里加入组件名进行注册，可以在注册时改名v-Register；（3）深拷贝与浅拷贝：数据类型分为基本数据类型和引用数据类型 ，其中基本数据类型包含number,string,null,undefined,boolean，引用数据类型包含Array,obje
2020-05-09 17:54:30
159
原创 组件element------Navigation组件
NavMenu 导航菜单顶栏-----导航菜单默认为垂直模式，通过mode属性可以使导航菜单变更为水平模式。另外，在菜单中通过submenu组件可以生成二级菜单。Menu 还提供了background-color、text-color和active-text-color，分别用于设置菜单的背景色、菜单的文字颜色和当前激活菜单的文字颜色。<el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @se
2020-05-09 17:42:41
375
原创 组件element------基础组件
基础布局<el-row> <el-col :span="24"><div class="grid-content bg-purple-dark"></div></el-col></el-row><el-row> <el-col :span="12"><div class="grid-content bg-purple"></div></el-col> <
2020-05-09 16:56:34
368
原创 ECharts百度图表
一、学习百度图表插件ECharts百度图表官方域名为：http://echarts.baidu.com。可以从该网站上下载百度图表的js文件，该文件的文件名为：echarts.js在使用百度图表的HTML文档中加载下载的echarts.js文件：<script type="text/javascript" src="js/echarts.js"></script>...
2020-05-06 21:52:15
3817
原创 11.微信小程序（Flex布局-容器属性）
大纲（1）场景（2）容器与项目元素（3）主轴与交叉轴（4）容器属性盒模型分类盒模型分类：IE盒模型，标准盒模型，本质区别：宽高计算方式场景在小程序开发中，需要考虑各种尺寸终端设备上的适配。在传统网页开发，用的是盒模型，通过display:inline | block | inline-block、 position、float来实现布局，缺乏灵活性且有些适配效果难以实现比如下...
2020-05-03 15:04:02
217
原创 微信小程序（组件--表单：滑块、开关、选择器）
表单组件（1）表单组件—slider滑动组件<!-- 表单组件---slider滑动组件 --> <slider min="10" max="60" show-value="true"></slider>颜色类属性滑块属性拖动事件 <!-- 表单组件---slider滑动组件 --> <!...
2019-12-10 16:57:34
782
原创 微信小程序（组件--表单：交互控件）
大纲（1）input输入框组件（2）textarea多行输入框组件（3）form表单组件（4）radio-group单选选择器与radio单选项目（5）label关联组件（6）checkbox-group多选选择器与checkbox多选项目表单组件（1）input输入框组件基础属性 <view> 姓名：<input value="吖吖吖" focus>...
2019-12-10 15:19:39
282
原创 微信小程序（组件--表单：按钮微信开放能力与客服）
前言按钮组件之open-type —微信开放能力常用属性值①contact客户会话②share分享转发③getPhoneNumber获取用户手机号④getUserInfo获取用户信息⑤openSetting授权设置页⑥feedback意见反馈页面表单组件按钮组件open-type 微信开放能力属性值----contact客服会话<button type="prima...
2019-12-08 17:54:59
413
原创 微信小程序（组件--表单：按钮）
表单组件（1）button按钮组件button按钮属性<!--pages/myself/biaodan/biaodan.wxml--><view>button按钮组件</view><button size="default">按钮</button> <!-- 按钮的大小 --><button type=...
2019-12-08 13:35:36
230
原创 微信小程序（组件--基础内容组件）
前言（1）icon图标组件（2）progress进度条组件（3）text文本组件（4）拓展：富文本编辑器UE和UM（5）rich-text 富文本组件基础内容组件（1）icon图标组件组件属性的长度单位默认为px，2.4.0起支持传入单位(rpx/px)icon图标组件type类型参数icon图标组件】<view>icon图标组件</view>...
2019-12-05 20:20:41
128
原创 微信小程序（组件--视图组件案例）
大纲（1）滑块视图容器swiper和滑块swiper-item组件（2）小程序scroll-view实现横向滚动导航（3）scroll-view满屏滚动（4）滚动Tab选项卡视图容器组件（1）滑块视图容器swiper和滑块swiper-item组件微信小程序swiper实现滑动放大缩小效果①先将基础轮播图写出来，开启无缝衔接模式circular<view>视图容器组...
2019-12-04 19:49:50
208
原创 微信小程序（组件--视图组件）
前言什么是组件？组件就是我们写HTML的一些基本标签，比如div、span、p、ul、li等。在大多数HTML里面的标签，很多都是要自己写上一些效果的，但是在小程序里面，很多标签都带有自己的效果，可以实现一些简单的JS逻辑。微信小程序里有很多很有意思的组件，这些组件给我们开发小程序提供了很大的便利简介一个小程序页面可以分解成多个部分组成，组件就是小程序页面的基本组成单元。为了让开发者可以...
2019-12-02 21:09:03
393
原创 微信小程序（WeUI框架）
前言前言：因为小程序的api描述都比较简单，并没有wxml及wxss的描述，有的人可能会想小程序有没有一个UI库。类似于前端中的常见的UI库例如Bootstrap、MDUI（简称MD）、Semantic UI（简称Semantic ）、uni-app、MUI、Element等等类似的框架UI库小程序UI库WeUI：结果当前是当前有的，它就是微信小程序官方推出的小程序UI库WeUI简介W...
2019-12-01 20:44:01
1202
原创 微信小程序（组件--收藏案例）
前言主要介绍下常见的收藏功能的实现需求分析样式分析：未收藏时为灰色态，点击收藏按钮，图标变色，同时弹框实体收藏成功；收藏成功后，点击已收藏的商品，取消收藏，此时图标恢复为灰色态，同时弹框提示取消收藏成功。逻辑分析：每个商品单独绑定个数据，负责管理收藏状态，点击时判断状态，然后切换收藏功能（1）先将图片静态样式写入因为收藏按钮是在商品展示栏上一层，所以可以用绝对定位到右下角，此...
2019-12-01 20:21:54
160
原创 微信小程序（事件对象-绑定、冒泡、捕获）
原生组件原生组件小程序中的部分组件是由客户端创建的原生组件，包含：①camera②canvas③input（仅在focus时表现为原生组件）④map⑤textarea⑥video事件冒泡事件触发验证事件冒泡验证点击子级蓝色区域点击父级红色区域target和currentTarget 属性的区别：event.target返回触发事件的元素event.curren...
2019-11-30 11:16:00
449
原创 微信小程序（触控事件）
事件简介事件简介①本质：事件是视图层到逻辑层的通讯方式②作用：事件可以将用户的行为反馈到逻辑层进行处理③应用：事件可以绑定在组件上，当达到触发事件，就会执行逻辑层中对应的事件处理函数④参数：事件对象可以携带额外信息，如 id， dataset， touches在编写代码中，使用频率高的事件方式是常见的事件类型注意：touch触屏系列事件常结合画布canvas组件使用，简单了解即...
2019-11-29 11:25:29
486
原创 微信小程序（路由及组件跳页传参）
大纲（1）API路由跳页传参（2）navigator导航组件跳页传参API路由跳页传参商品列表展示页商品展示页编写回到商城列表展示页，如果跳页时直接传参，会发现黄色警告，无法跳页小程序事件传递参数小程序事件传递参数在小程序中，给元素绑定事件不能直接传递参数，如果写成正解：①给元素绑定自定义属性data-item=”{{item}}”②在js中通过事件对象获取even...
2019-11-29 11:13:43
228
原创 微信小程序（组件跳转、规范、层级准备）
大纲（1）路由API跳转小结（2）hover样式（3）navigator导航组件跳转（4）路由跳转规范（5）页面层级准备前言回顾下路由API跳转:wx.navigateTowx.navigateBackwx.redirectTowx.switchTabwx.reLaunchDOM的API：document.createElement除了使用路由API进行页面跳转外，小程...
2019-11-29 10:01:50
120
原创 微信小程序（页面栈和API跳转）
大纲（1）数据操作限制补充（2）页面栈（3）API页面跳转—router路由APIwx.navigateTowx.navigateBackwx.redirectTowx.switchTabwx.reLaunch数据操作限制数据data的操作限制（1）直接修改Page实例的this.data而不调用this.setData是无法改变页面的状态的，还会造成数据不一致。（2）由于...
2019-11-29 09:46:45
174
原创 微信小程序（页面用户行为）
大纲（1）页面构造/注册器Page()（2）页面注册器参数data初始化数据页面生命周期页面用户行为其他（3）页面用户行为小程序界面渲染小程序界面渲染的基本原理：小程序的页面结构由WXML进行描述，WXML可以通过数据绑定的语法绑定从逻辑层传递过来的数据字段，数据来自于页面Page构造器的data字段，data参数是页面首次渲染时从逻辑层传递到渲染层的数据。双线程下的界面渲染...
2019-11-27 17:06:41
310
原创 微信小程序（页面生命周期）
大纲（1）页面构造/注册器Page()（2）页面注册器参数data初始化数据页面生命周期页面用户行为（3）页面生命周期及顺序前言小结：①小程序注册App()②页面注册Page()注册页面：对于小程序中的每个页面，在页面对应的 page.js 文件中调用 Page 方法注册页面示例作用：指定页面的初始数据、生命周期回调、事件处理函数等。页面的生命周期：页面生命周期函数就...
2019-11-27 16:48:40
924
原创 微信小程序（小程序生命周期、运行机制、场景值）
大纲（1）程序构造/注册器App()（2）小程序生命周期（3）小程序运行机制（4）scene场景值体验版特定页面设置体验人员扫描二维码进入时有时进入的不是首页？？？方案：登录小程序后台，重新设置体验版打开时的特定页面路径，更换为当前首页即可程序构造/注册器App()App()作用：注册小程序别名：程序构造器或者程序注册器参数：Object对象二级参数：data初始...
2019-11-27 16:39:38
151
原创 git与码云，工作必备
前言目前国内开发人员普遍都开始使用 Git 进行项目的版本管理课程大纲（1）Git 介绍，Git 作用，Git 工作流程（2）Windows 环境和 Linux 环境下安装 Git（3）码云常用操作（4）Git 常用命令操作（5）Git 分支命令操作Git 简介Git 的创始人同时也是 Linux 的创始人 Linus。Linus 早期在维护 Liunx 代码一直是人肉合并代码。...
2019-11-26 20:02:01
256
原创 微信小程序（跳页之tabBar导航跳转）
tabBar小程序导航简介小程序是一个多tab标签应用（客户端窗口的底部或顶部有tab栏可以切换页面），可以通过Tabbar配置项指定tab栏的表现，以及tab切换时显示的对应页面。小程序根目录下的 app.json 文件用来对微信小程序进行全局配置在小程序配置文件里面可以设置tabBar属性：先来个简单案例看下效果接下来挨个看下tabBar配置项下的属性：tabBar配置项...
2019-11-25 15:03:21
174
原创 微信小程序（小程序模型与宿主环境）
大纲（1）小程序模型（2）模型基本工作方式（3）数据驱动（4）通信模式（5）WebView（6）JsCore（7）宿主环境前言小程序可以调用宿主环境/微信提供的微信客户端的能力，这就使得小程序比普通网页拥有更多的能力(扫一扫、摇一摇)。小程序的运行环境分成渲染层和逻辑层， WXML 模板文件和 WXSS 样式文件工作在渲染层，JS 逻辑文件工作在逻辑层。渲染案例渲染“Hel...
2019-11-25 14:39:38
145
原创 AJAX之模板引擎&&字符串模板x-template
前言在js里面，经常需要使用js往页面中插入html内容写过一点前端的都会碰到需要使用JS字符串拼接HTML元素然后append到页面DOM树上的情况。一般的写法都是使用+号以字符串的形式拼接，如果html很短还好说，但是遇到描述里面的这么大段，直接用字符串存储会很困难，因为不光要处理单引号，还需要很多「+」号把字符串一个个连接起来，十分的不方便。比如有的时候需要使用弹出框的时候手动使用字符...
2019-11-23 16:08:21
161
原创 15.微信小程序（JS逻辑文件）
大纲（1）业务逻辑案例（2）调用API案例（3）ECMAScript----（4）小程序执行环境（5）模块化（6）作用域与全局变量前言一个服务仅仅只有界面展示是不够的，还需要和用户做交互：响应用户的点击、获取用户的位置等等。在小程序里边，通过编写 脚本文件来处理用户的操作。小程序的主要开发语言是 JavaScriptJS 作用：①开发者使用 JS来开发业务逻辑；②调用小程序...
2019-11-22 19:39:45
235
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人