- 博客(79)
- 收藏
- 关注
RSS订阅原创 vue项目突然不能运行
cnpmuninstallsass-loader-D//卸载。cnpminstallsass-loader@8.x-D//安装。nv12.14.0//安装指定版本降级。下载指定版本安装,升级。
2022-07-25 15:08:16
4759
1
原创 微信小程序插件开发
微信小程序插件开发说明微信原生技术开发插件开发和开发普通的小程序一样, 只不过某些接口或组件受到限制;插件需要在一个已上线的小程序(称为宿主)下进行申请;官方文档地址https://developers.weixin.qq.com/miniprogram/dev/framework/plugin/开发与使用参考这个地址新建插件项目https://developers.weixin.qq.com/miniprogram/dev/devtools/plugin.html项目建好后, 包
2022-05-30 11:23:53
2198
2
转载 es6模块import/export 使用总结
export/import使用总结export模块功能主要由两个命令构成：export和import。export命令用于规定模块的对外接口，import命令用于输入其他模块提供的功能。// profile.js 写法1export var firstName = 'Michael';export var lastName = 'Jackson';export var year = 1958;// profile.js 写法2var firstName = 'Michael';var
2022-05-25 11:45:35
576
转载 vue keep-alive 使用
前言keep-alive 是 Vue 的内置组件，当它包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。例如：在开发中经常有从列表跳到详情页，然后返回详情页的时候需要缓存列表页的状态（比如滚动位置信息），这个时候就需要保存状态，要缓存状态。在组件切换过程中将状态保留在内存中，防止重复渲染DOM，减少加载时间及性能消耗，提高用户体验性。使用方式为<keep-alive> <component /></keep-alive>这里的component会被..
2022-04-18 17:03:40
3108
1
转载 vue-router跳转与传参
1、vue-router不带参数<router-link :to="{name:'home'}"> <router-link :to="{path:'/home'}"> //name,path都行, 建议用name 带参数// params传参数<router-link :to="{name:'home', params: {id:1}}"> // 路由配置 path: "/home/:id" 或者 path: "/home:id" //
2022-04-18 16:39:50
827
原创 设备像素及倍图使用
屏幕尺寸像素等之间的关系英寸: 屏幕物理大小, 确定值, 对角线值, 手机显示器的4.8、5.7, 电脑显示器的17、22;像素(物理像素，设备上真实的物理单元): 即一个小方块，它具有特定的位置和颜色。像素可以作为图片或电子屏幕的最小组成单位屏幕分辨率: 指一个屏幕具体由多少个像素点组成。iPhone XS Max 和 iPhone SE的分辨率分别为2688 x 1242和1136 x 640.这表示手机分别在垂直和水平上所具有的像素点数.图像分辨率: 指图片含有的像素数..
2022-01-19 16:27:51
2164
原创 微信小程序PDF下载方案
1. 可以给用户一个链接，提示在浏览器打开并下载;2.如果希望保存在本地，这个几乎不可能，但是可以让后端将pdf转换成png长图，保存到相册;3.wx.openDocment({ filePath: 'filePath', fileType: 'pdf', showMenu: true, // 添加该属性, 点击右上角菜单, 将文件分享给好友 success(){ }})...
2022-01-18 09:58:25
5494
原创 微信小程序UI组件库合集
微信小程序实用UI组件库合集。UI组件库合集，大家有遇到好的组件库，欢迎留言评论然后加入到文档里。第一款：官方WeUI组件库，地址WeUI组件库简介 | 微信开放文档预览码：第二款：ColorUI：地址https://github.com/weilanwl/ColorUI预览码：第三款：vantUI（又名：ZanUI）：地址Vant Weapp - 轻量、可靠的小程序 UI 组件库预览码：第四款：MinUI： 地址https...
2022-01-17 11:02:26
6703
1
转载 Vue — 详解mixins混入使用
前言当我们的项目越来越大，我们会发现组件之间可能存在很多相似的功能，你在一遍又一遍的复制粘贴相同的代码段（data，method，watch、mounted等），如果我们在每个组件中去重复定义这些属性和方法会使得项目出现代码冗余并提高了维护难度，针对这种情况官方提供了Mixins特性一、什么是Mixins？mixins（混入），官方的描述是一种分发 Vue 组件中可复用功能的非常灵活的方式，mixins是一个js对象，它可以包含我们组件中script项中的任意功能选项，如data、compone
2022-01-17 10:04:01
365
原创 微信小程序版本更新提示
提交代码时选择版本升级代码 onLaunch() { this.updateVersions() } // 版本更新提示 updateVersions() { const updateManager = uni.getUpdateManager() updateManager.onCheckForUpdate((res) => { if (res.hasUpdate) { // 新的版本下载中.
2021-11-02 16:21:47
980
转载 微信小程序scroll-view实现左右联动
需求：项目中做了一个选择城市的需求，要求全国所有的省市区都按照中文首字母分类并排序，左侧的城市列表和右侧的字母列表实现双向联动。第一步：根据腾讯提供的javascript SDK提供的接口，获取所有的省市区，并将省市区按照首字母进行分类排序。 let _this = this; _this.mapCtx = wx.createMapContext("myMap"); // 实例化API核心类 qqmapsdk = new QQMapWX({...
2021-11-02 11:05:01
1034
转载 前端js正则表达式2
第四章 正则表达式的拆分5.1. 结构和操作符编程语言一般都有操作符。只要有操作符，就会出现一个问题。当一大堆操作在一起时，先操作谁，又后操 作谁呢？为了不产生歧义，就需要语言本身定义好操作顺序，即所谓的优先级。上面操作符的优先级从上至下，由高到低。5.2. 注意要点关于结构和操作符，还是有几点需要强调：5.2.1 匹配字符串整体问题因为是要匹配整个字符串，我们经常会在正则前后中加上锚 ^ 和 $。比如要匹配目标字符串 “abc” 或者 “bcd” 时，如果一不小心，就会写成 /^ab
2021-09-28 10:39:42
389
转载 前端js正则表达式
正则表达式第一章 正则表达式字符匹配攻略1.1. 两种模糊匹配1.1.1. 横向模糊匹配一个正则可匹配的字符串的长度不是固定的，可以是多种情况的。譬如 {m,n}，表示连续出现最少 m 次，最多 n 次。其实现的方式是使用量词。例如let reg = /ab{2,5}c/;var regex = /ab{2,5}c/g;var string = "abc abbc abbbc abbbbc abbbbbc abbbbbbc";console.log( string.match(regex) )
2021-09-28 10:36:42
603
原创 前端打印及后端生成PDF
vue中前端打印CSS按正常样式书写, flex, 嵌套,主流样式,都可以用;JS涉及到图片, 必须是https地址, 且要等图片加载完成后, 再去打印;//判断打印中的审核签名图片是否加载完成 judgeVerifySign() { let that = this; if (that.orderDetial.verifySign) { let el = document.getElementById('verifySign');
2021-09-23 09:33:12
1364
原创 原始js实现循环轮播图
html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>轮播图最.
2021-09-10 14:35:59
232
转载 原生js实现淘宝放大镜
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>原生js放大镜<.
2021-09-09 16:42:07
132
原创 前端Js常用宽高及位置
一个页面显示在浏览器内,浏览器又放置在屏幕窗口内,所以由里向外便是 页面 , 浏览器 , 屏幕 三者.1.屏幕尺寸screen.availHeight(window.screen.availHeight): 屏幕可用高度screen.availWidth: 屏幕可用宽度screen.height: 屏幕分辨率高度screen.width: 屏幕分辨率宽度2.浏览器尺寸window.outerHeight: 浏览器高度 , 此高度包含了水平滚动条..
2021-09-09 11:03:13
574
转载 移动端适配 postcss-px-to-viewport
我们先把它安装到项目的开发环境中： npm i postcss-px-to-viewport -D在项目根目录下添加.postcssrc.js文件 添加如下配置：module.exports = { plugins: { autoprefixer: {}, // 用来给不同的浏览器自动添加相应前缀，如-webkit-，-moz-等等 "postcss-px-to-viewport": { unitToConvert: "px", // 要转化的单位
2021-09-07 17:12:42
420
转载 前端CSS移动端适配
导读移动端适配，是我们在开发中经常会遇到的，这里面可能会遇到非常多的问题：1px问题 UI图完美适配方案 iPhoneX适配方案 横屏适配 高清屏图片模糊问题 ...上面这些问题可能我们在开发中已经知道如何解决，但是问题产生的原理，以及解决方案的原理可能会模糊不清。在解决这些问题的过程中，我们往往会遇到非常多的概念：像素、分辨率、PPI、DPI、DP、DIP、DPR、视口等等，你真的能分清这些概念的意义吗？本文将从移动端适配的基础概念出发，探究移动端适配各种问题的解决方案和实现原理。
2021-09-07 15:09:50
1354
转载 前端防抖与节流
防抖言简意赅:函数的执行者冷静下来后（不一直抖动后），才真正执行。深入理解：触发事件时，只在事件触发 n 秒后才执行，如果你在一个事件触发的 n 秒内又触发了这个事件，那我就以新事件触发的时间为准，n 秒后才执行。比如频繁触发的某一函数，防抖可以只在最后一次触发后执行。总之，就是要等你触发完事件的 n 秒内不再触发事件，才执行。// func是用户传入需要防抖的函数// wait是等待时间const debounce = (func, wait = 50) => { // 缓存一
2021-09-06 15:09:15
128
转载 前端常用的八种数据结构
数据结构就是关系，没错，就是数据元素相互之间存在的一种或多种特定关系的集合。传统上，我们把数据结构分为逻辑结构和物理结构。 逻辑结构：是指数据对象中数据元素之间的相互关系，也是我们今后最需要关注和讨论的问题。 物理结构：是指数据的逻辑结构在计算机中的存储形式。1.数组（Array）数组是最简单、也是使用最广泛的数据结构。数组是可以在内存中连续存储多个元素的结构，在内存中的分配也是连续的，数组中的元素通过数组下标进行访问，数组下标从0开始。数组：查询快，增删慢 查询快：数组的地址是连续的，
2021-08-25 10:10:21
3448
转载 前端需要了解的设计模式
什么是设计模式？设计模式是对软件设计开发过程中反复出现的某类问题的通用解决方案。设计模式更多的是指导思想和方法论，而不是现成的代码，当然每种设计模式都有每种语言中的具体实现方式。学习设计模式更多的是理解各种模式的内在思想和解决的问题，毕竟这是前人无数经验总结成的最佳实践，而代码实现则是对加深理解的辅助。设计模式的类型设计模式可以分为三大类：结构型模式（Structural Patterns）：通过识别系统中组件间的简单关系来简化系统的设计。 创建型模式（Creational Patter.
2021-08-23 11:44:46
227
原创 React Native 入门踩坑
开发环境搭建及环境变量配置开发rn第一步需要配置安卓环境android studio下载地址: https://developer.android.google.cn/studio/archive参考官方文档 使用科学的上网方式配置即可官网参考地址: https://www.react-native.cn/docs/environment-setup我的环境 macos+ 安卓;初始化项目npx react-native init ProjectNamecd 项目文件yarn insta
2021-08-04 14:40:28
736
转载 MAC系统下完全卸载Android Studio
1、卸载Android Studio，在终端(terminal)执行以下命令：rm -Rf /Applications/Android\ Studio.app rm -Rf ~/Library/Preferences/AndroidStudio* rm ~/Library/Preferences/com.google.android.studio.plist rm -Rf ~/Library/Application\ Support/AndroidStudio* rm -Rf ~/Library/
2021-08-02 15:42:24
667
转载 MAC下网易MuMu模拟器调试ReactNative
首先 下载并安装好网易MuMu模拟器: https://mumu.163.com/mac/index.html运行网易MuMu,打开后在首页打开设置->开发者选项->打开USB调试模式如果已经打包好的apk文件，则直接将apk文件拖动到模拟器窗口，apk会被自动安装ADB connect这里需要说明一下，在我看了一堆博客之后，发现这个MuMu在MAC和PC下是的端口号是不一样的。windows端口号是7555，macOS下端口号是22471，下面的指令需要根据系统不同自己修改
2021-08-02 14:53:08
2550
原创 uniApp开发安卓App调试与打包
总结一下auniapp开发安卓app的调试方式及打包;代码编程查看文档即可.;1通过vue-cli方式初始化项目参考地址: https://uniapp.dcloud.io/quickstart-cli2 将app实时安装到手机上使用vscode编辑代码, 使用hubuilder去调试运行及打包手机打开开发者模式 连接电脑选中运行的项目;编辑器代码更新,手机上交互实时更新;3使用谷歌浏览器devtools工具调试app页面浏览器打开此链接chrome://inspect/#devic
2021-08-02 11:29:53
6589
转载 uniapp离线打包Android应用
本文参考转载参考: 1. https://www.jianshu.com/p/1659564356392.https://www.jianshu.com/p/087b2cf1170e1 安装android studio下载地址:1 https://www.androiddevtools.cn/2 https://developer.android.google.cn/studio/archive安装一路next即可安装好后 启动软件一定等它下载完毕再去操作下载最新
2021-07-08 17:18:31
596
转载 mac下生成安卓签名证书
检查自己的MAC ,有没有安装Java的 JDK打开Mac下的终端(Terminal.app)在终端输入以下命令/usr/libexec/java_home -V如果有安装过JDK,就会出现以下结果,如果还没有安装过Java JDK环境的小伙伴,先去自行安装JDK环境,再继续下面的步骤.红框里面就是jdk在Mac的路径,我们需要进入这个路径下,完成后续的步骤cd /Library/Java/JavaVirtualMachines/jdk1.8.0_231.jdk/Contents/Home
2021-07-07 17:39:02
690
原创 react项目配置不同环境下的接口地址
思路就是使用配置文件 和全局变量1 修改package.json记得先npm i cross-env -S "scripts": { "start": "node scripts/start.js", "build": "node scripts/build.js", "test": "node scripts/test.js", //以下为新增命令 // 开发环境启动 "server:dev": "cross-env env_config=de
2021-06-30 15:06:36
1801
原创 react入门笔记之数据共享
数据共享父子组件父组件// 渲染子组件 传递 数据 id ; 方法 getId<MenuList id={'111'} getId={(id)=> {this.getId(id)}}></MenuList>getId(id) { console.log('子组件传过来的id', id);// '666'} 子组件 componentDidMount(){ // 输出父组件参数id console.log('this.props.id
2021-06-30 10:36:52
338
原创 react入门笔记之路由
路由基本使用import React, { lazy, Suspense } from 'react';// 引入全局cssimport './assets/css/index.css';import { BrowserRouter, Switch, Redirect} from 'react-router-dom';import PrivateRoute from './utils/privateRoute.js'; //私有路由// 加载路由页面组件const Home = lazy((
2021-06-30 10:31:03
196
原创 react入门笔记之组件生命周期
生命周期各阶段调用顺序// 1. 初始化阶段: 由ReactDOM.render()触发---初次渲染// 1. constructor()// 2. getDerivedStateFromProps // 3. render()// 4. componentDidMount() =====> 常用// 一般在这个钩子中做一些初始化的事，例如：开启定时器、发送网络请求、订阅消息// 2. 更新阶
2021-06-30 10:22:35
175
原创 react入门笔记
路由基本使用import React, { lazy, Suspense } from 'react';// 引入全局cssimport './assets/css/index.css';import { BrowserRouter, Switch, Redirect} from 'react-router-dom';import PrivateRoute from './utils/privateRoute.js'; //私有路由const Home = lazy(() => imp
2021-06-28 14:55:21
193
原创 react各生命周期函数使用场景：
1. Constructor(props)使用场景：初始化局部State或把方法的句柄绑定到实例注意：第一个语句必须是super（props）2.GetDerivedStateFromProps(props,state)使用场景：内部state变化依赖于props时，注意：不要过度使用该函数。 如果你的操作依赖于props的更改并有副作用，最好放到ComponentDidUpdate中； 如果需要根据props的改变更新某些数据，最好使用memoization...
2021-06-23 11:02:40
304
原创 安装指定版本的nodejs
node有一个模块n，是专门用来管理node.js的版本的。npm install-g n2、升级node.js到最新稳定版 n stable3、安装指定版本：n v16.11.5
2021-04-26 16:48:03
422
转载 命令行模拟post请求
使用curl 命令 发送 get post 请求curl http://xxxxx/xx默认是get的请求发送 post 携带参数curl http://xxx/xxx -X POST -d "username=sam&password=123456"
2021-04-21 17:52:36
1338
原创 mac 安装mongodb 配置及启动
1 官网下载安装包2 复制到 /usr/local 目录下打开finder => shift + command + g 打开并修改文件名为 MongoDB3 配置环境打开终端，输入“open -e .bash_profile”，打开.bash_profile文件并编辑，添加 export PATH=/usr/local/MongoDB/bin:$PATH保存 退出在终端中，输入source .bash_profile使配置生效4 验证m...
2021-04-14 13:59:25
353
原创 新建一个koa2项目
安装koa2生成器: npm install -g koa-generator新建项目:koa2 test_koa安装:npm install启动:npm start
2021-04-13 13:54:42
462
原创 uniapp添加自定义底部弹出框
<template> <view class="wrap"> <view @tap="showModal"> <text>{{value}}</text> <icon class="arrow"></icon> </view> <!-- modal --> <view class="modal modal-bottom-dia.
2021-03-10 16:54:04
3024
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人