- 博客(38)
- 资源 (4)
- 收藏
- 关注
RSS订阅
原创 小程序实现地图找房功能
思路解析：使用小程序的 map 地图组件 ，markers 标记点数据集合 用来生产地图上的标记，用callout 或者label 实现气泡，本文使用的是callout ，最后如何实现点击气泡更新下方展示数据，使用到的是 markers的id属性(注意一定是数字类型不可是字符串)最终实现效果图语法使用的是uniapp，原生小程序和uniapp实现方式大致一致html<template> <view class="owarp"> <view class="head
2021-05-25 13:16:22
2964
6
原创 h5与app（android,ios）端交互
app嵌入h5页面，可以使用vue项目构建的页面，也可以使用原生的html页面，我在这写的是原生的html页面代码地址：原理分析：1）h5和app之间通过url 传递数据2）app会提供一个接口对象的引用（即app端留着h5调用的方法）具体步骤1.发送给app端的ajax的请求封装var ajaxMethod = function (url, params, type, callba...
2019-10-15 14:32:47
2347
3
原创 pngquant failed to build, make sure that libpng-dev is installed 问题
第一个参考方案失败 ：npm install -g windows-build-tools@4.0.0。第二个方案，降低node 版本 失败。第4种方案修改 host文件没有试。先执行，下面两行代码，再按照依赖。安装失败，提示 依赖不在支持。
2023-11-01 10:57:10
1535
2
原创 uniapp小程序生成海报图
实现方式：1:使用canvas画图，2：使用Painter实现本文说一下canvas实现方式（适配暂未处理）先来看一下绘制完成后的效果图canvas 区域我设置的为上半部分（按钮不包含在内）一、页面中添加canvas标签<canvas canvas-id="posterid" style="width: 315px;height: 366px;" disable-scroll="true" @touchstart="" @touchmove="" @touchend=""></
2020-12-23 14:25:12
3631
原创 vue中使用语音提示
yuyin(str) { // 语音提示方法 // str播报的文字 var url = 'http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&spd=6&text=' + encodeURI(str) var n = new Audio(url) n.src = url n.play() // 播放阅读 },注意事项：如果在mounted中 直接写语音播报的代码会报
2020-10-23 10:23:27
808
原创 electron 打包vue项目
安装 electron electron-packagercnpm install electron --save-dev cnpm install electron-packager --save-dev //这个是打成exe文件的插件，之后要用，提前下载好在vue项目中的package.json 添加 两个命令“electron”:“npm run build && electron build/electron.js”,“packager”: “electron-pa..
2020-09-14 13:16:16
475
原创 h5 微信授权
一、获取codeconst reUrl = location.href.split('#')[0] //获取code 之后返回的页面 const appid = 'xxxxxx' //公众号的appid // 获取code 的url 地址 ，scope 的值有snsapi_userinfo和snsapi_base //此处我用的是静默的方式 const url = `https://open.weixin.qq.com/connect/oauth2/author
2020-08-12 13:49:41
464
原创 h5公众号开发微信的js-sdk的使用
我的项目使用的是vue 开发的，因此首先安装 weixin-js-sdk具体步骤如下：一、安装weixin-js-sdknpm i weixin-js-sdk --save二、在使用的页面引入 ，或者全局引入import wx from 'weixin-js-sdk'三、 获取wx.config 所需要的数据，同时添加所需要使用的js-sdk的方法getConfig({ url: location.href.split('#')[0] }).then(res =>
2020-08-12 13:40:00
960
原创 vue-cli3.x/4.x vant 移动端适配
1.安装 lib-flexible 插件 ，手淘的移动端适配方案npm i lib-flexible --save2.在main.js中引入import 'lib-flexible'安装 postcss-px2rem-exclude 插件，主要解决的是vant等第三方UI框架在750或其他尺寸设计稿样式变形问题npm i postcss-px2rem-exclude --save注意： 如果使用了 postcss-px2rem 先将改插件删除4.创建 postcss.config.js
2020-08-12 13:30:41
344
原创 小程序中使用防抖和节流
函数防抖函数节流，真正的含义是：延迟函数执行。即不管debounce函数触发了多久，只在最后一次触发debounce函数时，才定义setTimeout，到达间隔时间再执行 需要防抖的函数。用处：多用于 input 框 输入时，匹配的输入内容，加入购物车，防止发起请求的按钮多次请求接口等情况函数节流函数节流，真正的含义是：单位时间n秒内，第一次触发函数并执行，以后 n秒内不管触发多少次，都不...
2020-04-22 15:44:57
2364
3
原创 小程序资源下载、解压、保存到本地及本地文件的使用
小程序对资源存储有限一般10M，不要超过限制思路解析：将资源保存到本地，首先 需要获取到 本地路径 ，然后将文件下载（下载前需要判断文件是否更新，第一次和更新则需要下载，如果存在之前的资源则将其删除），解压（压缩包需要解压，解压完成将压缩包删除，非压缩包略过）， 保存到本地路径， （可以自行创建本地目录，把资源统一保存在改目录下），页面中使用本地路径中的资源。小程序中获取用户表本地路径 ： w...
2019-12-11 16:45:51
3354
转载 小程序显示弹窗时禁止底层页面滚动
当弹框内容有滚动的时候，采用第一种方式有效① 第一种方式利用position:fixed. 禁止页面滚动.一. 页面结构html<view class="indexPage {{proInfoWindow?'indexFixed':''}}"> -----------此处为整个页面的结构内容 <button catchTap="_proInfoWind...
2019-12-11 15:57:06
1147
原创 uniapp基础使用入门
uniapp 项目的创建：可以使用hbuildx也可以npm的方式，不同之处在于，开发app只能用hbuildx。这里介绍使用hbuildx的方式，（npm 方式可以参考官网）项目创建步骤：1）操作如下图，点击 项目2） 选择需要创建的项目类型： 选择之后点击创建，uniapp项目即创建完毕，uni-app是可以多平台运行的创建，主要特色就是它的条件编译和跨端，接下来看配置1.p...
2019-10-16 15:56:02
1659
2
原创 单向数据流和双向数据流及双向数据绑定
在react中是单向数据绑定，而在vue中的特色是双向数据绑定。但是其实就我个人的理解是：其实无论是vue还是react其实还是提倡单向数据流去管理状态，这一点在vuex和redux状态管理器上体现的很明显。只是vue为UI控件提供了双向数据绑定的方式，在一些需要实时反应用户输入的场合会非常方便。但通常认为复杂应用中这种便利比不上引入状态管理带来的优势。1.单向数据流示意图：state：...
2019-10-16 15:14:34
2420
原创 vue excal 表格导出
案例以vue 和element 为例element 按照 正常的使用方法 安装，使用具体看导出步骤：1.安装依赖项 ：npm i file-saver xlsx script-loader -D2.下载 所需的js 文件在 src 下创建目录，并将下方的js文件放到该目录3.可以封装一个导出的组件 （方便复用）新建一个导出组件：<template title="导出表格...
2019-09-05 15:55:01
195
2
原创 gitLab 的使用
第一次使用git 时需要配置，用户名和邮箱，及公钥生产。git config --global user.name “2736027872”配置用户名git config --global user.email “2736027872@qq.com”配置邮箱ssh-keygen -t rsa -C “2736027872@qq.com”生成公钥和私钥使用gitlab 时，把 公钥添加...
2019-08-26 11:24:11
270
原创 记录一下学习笔记
函数式编程参考地址：https://mp.weixin.qq.com/s/ORgzFu9Fri4u3wLVfsr71A概念：函数式编程是一种强调以函数使用为主的软件开发风格。函数式编程的目的：是使用函数来抽象作用在数据之上的控制流和操作，从而在系统中消除副作用并减少对状态的改变。特点：声明式编程，纯函数，引用透明，不可变数据函数柯里化 ：目前不是太懂CSS filter参考地址：ht...
2019-06-11 11:05:17
467
原创 git 的使用（多人协作）
1)git init //初始化git 仓库2)Git clone git@github.com:genwozou/ch.git //clone 项目3)Cd 仓库名/ //进入到仓库目录4)Git checkout -b ‘fz’ // 创建自己的分支5)Git add . //添加到本地仓库6)Git commit -m ‘描述’ // 添加到本地仓库7)G...
2019-05-28 10:00:58
207
原创 原生js实现表格拖动选项
题目要求如下图所示，具体思路：拖动改变选择项，用的的事件是js的拖动相关事件。<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, ...
2019-04-11 13:08:50
1245
原创 js 实现 to do list
// js 实现 to do listhtml结构如下：<input type="text"><button id="btn"> 添加</button><div id="content"></div>js 代码如下 var arr=[]; var val=document.getElem
2019-03-15 16:31:35
1260
3
原创 react 中redux的使用
redux 介绍：Redux 的适用场景：多交互、多数据源Redux对于JavaScript应用而言是一个可预测状态的容器。换言之，它是一个应用数据流框架，而不是传统的像underscore.js或者AngularJs那样的库或者框架。Redux最主要是用作应用状态的管理。简言之，Redux用一个单独的常量状态树（对象）保存这一整个应用的状态，这个对象不能直接被改变。当一些数据变化了，一个新...
2019-03-11 15:21:56
159
原创 react 中的flux介绍
flux和redux都是根据组成部分创建对应的js文件Flux是Facebook用来构建客户端Web应用的应用架构。它利用单向数据流的方式来组合React中的视图组件。它更像一个模式而不是一个正式的框架，开发者不需要太多的新代码就可以快速的上手Flux。流程：View(view,controller-view) 视图层 -->Action动作–>Dispatcher派发器—&g...
2019-03-11 15:18:04
1191
原创 react 脚手架创建项目步骤
前序：react 脚手架创建项目，分react高低版两种，接下来具体看实施react低版本1、全局环境：npm install -g create-react-app创建项目：create-react-app 项目名创建好之后，根据提示执行，如果没有提示还是看package.json 文件/22、使用create-react-app 创建项目，里面安装的react的版本默认的是高板，在...
2019-03-11 15:14:06
798
原创 vue常见项目bug整理
常见项目bug整理项目工程化vuex的使用1.在src文件下建 store文件 index.js 存放仓库数据2.在main.js中 import 导入该文件，并在vue实例中添加storeeg:import store from ‘./store’new Vue({el: ‘#app’,router,store,components: { App },template: ...
2018-12-29 20:33:34
6034
原创 鼠标拖拽效果
本文以拖拽div盒子为例思路分析：要实现拖拽效果，首先应该具备这三个事件 --按下、移动、抬起事件，当鼠标按下时，获取鼠标的坐标，当鼠标移动时，将鼠标的位置坐标给div，鼠标抬起时，清除移动事件具体实现：//css样式<style type="text/css"> #box{ position: absolute; width: 200px; he...
2018-10-17 20:27:05
553
原创 DOM2级事件的兼容
主流浏览器支持的是：addEventListener(事件名，处理函数，布尔值)，移除 —removeEventListener(事件名，处理函数)IE浏览器支持的是：attachEvent(事件名，处理函数)，移除detachEvent(事件名，处理函数)根据这两个特性，就可以写出DOM2级添加和移除事件的兼容先补充一点基础知识：//添加事件function addEvent(o...
2018-10-17 20:13:18
190
原创 一组内容跟着鼠标移动
下面代码主要实现，一组div跟着鼠标移动，形成队列式的跟随，样式很简单，可以自己设计，主要来说一下思路：第一个跟着鼠标动，后一个跟着前一个移动，就可以实现尾随的效果，具体来看一下js代码<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title&am
2018-10-17 19:57:29
213
原创 node初学者笔记
node.js###用到node的地方基于node环境安装es6转es5 es6中：变量 let const 模板字符串 `` ----拼接字符串 数组 map,foreach … 使用()=&gt;{} 改变 this指向 class extends2.工具-------自动化构建工具 gulp , webpack ，grunt...
2018-10-12 20:16:58
508
原创 phpstrom设置外部服务器.md
1.选择file —&amp;gt;Settings2.选择Languages&amp;amp;Framworks ------&amp;gt;PHP(1) 选择PHP language level 的版本(2) 选择 CLI Interpreter 为php(3) 然后点击右上方的小框框3.进入到下方的页面，找到你的php.exe的路径点击apply -------&amp;gt;ok4.设
2018-10-06 17:51:16
391
1
原创 cookie 购物车
数据应该是后台传来，在这我是用数组模拟的，根据数组长度生成对应的数据，代码会用到封装好的cookie，我把cookie上传到资源里了，需要的可以下 商品页代码：（这些代码是写在script标签内的）//数组中存储的数据，图片路径根据自己的修改即可var data = [{ "id":10001, "title":"蒙牛"
2018-09-16 18:53:40
522
原创 自动补全
思路：每次文本框输入的时候都去发送ajax请求，得到相关的数据，然后再把这些数据添加到页面中，就可以实现自动补全的效果 html结构代码：&amp;lt;input type=&quot;text&quot; name=&quot;txt&quot; id=&quot;txt&quot; /&amp;gt;&amp;lt;ul id=&
2018-09-16 11:55:37
336
原创 分页
思路：利用ajax请求数据的总长度，及每页显示的条数，求出需创建总页数 具体代码如下： html结构代码：&amp;lt;ul id=&quot;list&quot;&amp;gt;&amp;lt;/ul&amp;gt;&amp;lt;ul id=&quot;btm&quot;&amp;gt; &amp;
2018-09-16 11:30:33
128
原创 星级评价
我用的是背景图片的星星，通过改变背景定位的位置，改变星星的样式 html结构代码：&lt;ul&gt; &lt;li&gt;&lt;/li&gt; &lt;li&gt;&lt;/li&gt; &lt;li&gt;&lt;/li&gt;
2018-09-15 19:29:07
365
原创 元素水平垂直居中
元素水平垂直居中的四种方式1） 定位方式position:absolute;top:50%;left:50%;margin-left:(自身宽度的一半);margin-top:-50%value（自身高度的一半）2） 定位position:absolute;top:0;left:0;right:0;bottom:0;margin:auto;3） flex的方式...
2018-09-15 19:15:45
134
原创 自适应瀑布流
css修饰代码：&lt;style type="text/css"&gt; body{ padding: 0; margin: 0; } #wrap{ position: relative; } ...
2018-09-15 19:06:39
266
原创 svn的使用
svn的使用步骤安装好svn服务和svn客户端后 第一步：在所有程序中找到VisualSVN ，选择第二个程序 得到如图所示的窗口 选择第一个文件右键——创建新的仓库 选择第二个文件—创建用户 下面分组和jobs根据需要进行创建二、仓库准备好之后，从svn获取资源 在桌面任意空白处右击——出现如下图的框 选择SVN Checkout —–右击 创库路径——...
2018-09-11 14:54:43
240
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人