- 博客(55)
- 收藏
- 关注
RSS订阅原创 vue.config.js
'use strict'const path = require('path')// gzip压缩插件const CompressionWebpackPlugin = require('compression-webpack-plugin')// 代码打包之后取出console.log压缩代码const TerserPlugin = require('terser-webpack-plugin')// 图形化打包详情const BundleAnalyzer = require('web
2022-03-22 17:11:49
141
原创 Html页面引入CDN链接
<!DOCTYPE html><html lang=""> <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"> <link rel="ico
2022-03-14 15:33:35
1497
2
原创 自定义弹窗
.houselist{ height: 330px; width: 100%; position: fixed; bottom: 0; left: 0; background-color: rgb(255, 255, 255); transform: translateY(330px); transition: all 1s;}
2022-01-26 14:02:40
870
原创 链接跳转小程序
<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="Expires" content="0"> <meta http-equiv="Pragma" content="no-ca
2021-12-03 14:22:51
519
原创 时间戳转化具体时间
export function formateDate(shijianchuo, formatNumber = 6) { function add0(m) { return m < 10 ? '0' + m : m } return (function () { //shijianchuo是整数，否则要parseInt转换 const time = new Date(shijianchuo); const y = time.getFullYear();
2021-11-08 14:56:32
371
原创 数组里添加对象
[ { label: '任务名称', name: 'taskName' }, { label: '任务类型', name: 'taskType' }, { label: '拓客地点', name: 'addressdtail' }, { label: '渠道专员', name: 'outUserName' }, ...(this.beeRol
2021-10-28 21:03:34
199
原创 lodash
//将多个同类的数据，归置到一起_.groupBy(this.projectList, project => project.area.companyName)//将对象变成数组，键值为一组_.toPairs( )
2021-10-28 20:58:02
73
原创 微信小程序 图片选择 上传
import React, { useImperativeHandle, forwardRef } from 'react';import { TouchableHighlight } from 'react-native';import { PlatformApi } from '@/utils/platform';import { request } from '@terminus/mall-utils'export const getTrantorOssInfo = () => {
2021-10-13 11:50:33
94
原创 微信订阅消息
const tmplIds = ['','','']//多个tmpids用数组 wx.requestSubscribeMessage({ tmplIds: tmplIds, success: async (res) => { console.log('tmplIds',res); const list = tmplIds.filter(item => res[item] == 'accept').j
2021-10-12 15:17:47
144
原创 微信小程序 将图片保存到本地
wx.downloadFile({ url: confirmationUrl,//confirmationUrl图片地址 success: (res) => { wx.saveImageToPhotosAlbum({ filePath: res.tempFilePath, success: (res) => { wx.showToast({ title: '保存成功
2021-10-12 13:28:41
1002
原创 将同一楼层的数据，归属到同一个数组
const floorList = []; const roomIdList = []; needfloorList.forEach(listItem => { const floorObj = floorList.find( item => item.floorNumber === listItem.floor ); if (floorObj) { roomIdList...
2021-10-11 11:38:20
78
原创 js复制内容
handleCopy(text) { let input = document.createElement('input'); input.setAttribute('value', text); document.body.appendChild(input); input.select(); let res = document.execCommand('copy'); document.body.removeChild(input); }
2021-09-14 17:45:05
85
原创 验证数据类型 typeof
//封装验证类型const Utils = { UrlParser: UrlParser, _typeof(obj) { return Object.prototype.toString .call(obj) .slice(8, -1) .toLowerCase(); },//使用例子： isPlainObject(obj) { return Utils._typeof(obj) === "object"; },...
2021-08-27 15:23:50
100
原创 判定列表最下是否需要边框
:style="{ borderBottomWidth: index === noticeData.length - 1 ? '0px' : '2px' }"
2021-08-16 17:24:13
87
原创 60秒倒计时
btnText() { const time = setTimeout(() => { if (this.second === 0) { this.second = 60;//初始化60秒 this.sended = false;//控制样式变化 clearTimeout(time); this.text = '获取验证码'; } else { this.b.
2021-07-27 17:16:36
134
原创 backgroundImage(背景渐变)
从上到下开始渐变由黄色到深黄色backgroundImage: 'linear-gradient(180deg, #fae969, 0%, #eda627 100%)'
2021-05-26 13:57:18
180
原创 小程序制作海报
<view class="container log-list"> <canvas type="2d" id="myCanvas" style="width: 400px; height: 500px;"></canvas> <button type="primary" bindtap="handleExport">保存为图片</button></view>// logs.jsconst util = requi
2021-05-06 17:05:33
111
原创 2行益处显示省略号
.line2{ display:-webkit-box; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:2; word-break:break-all;}
2021-05-05 22:34:30
123
原创 ts配置
文件名称：tsconfig.json{ // 编译选项 "compilerOptions": { // 编译输出目标 ES 版本 "target": "es5", "downlevelIteration": true, "lib": ["es5", "es6", "dom", "dom.iterable"], // 采用的模块系统 "module": "es2015", // 以严格模式解析 "strict": false, //
2021-04-01 10:04:57
224
原创 react-Spring动画
例子import React,{Component} from 'react'import {Spring} from 'react-spring/renderprops'export default class index extends Component { render(){ <div> {/* from初始样式 to结束样式*/} <Spring from={{opacity:1}} to={{opacity:0}} config={{durati
2021-02-25 23:05:26
300
原创 前端 关于图形验证码和短信验证码
html部分<template> <page-container titleBg="#ffffff" :title=" defaultPage === 'by-mobile' ? '忘记密码' : step === 1 ? '发送验证码' : '修改密码' " v-on="$listeners" > <div class="container">.
2021-02-20 11:37:09
479
原创 Android studio模拟器
下载Android studiohttp://www.android-studio.org/下载jdk最新版本的jdk不行https://www.oracle.com/java/technologies/javase/javase-jdk8-downloads.html创建模拟器下载AndroidSDKweex命令打开模拟器然后就可以在模拟器测试了...
2021-02-20 09:23:27
152
原创 vue 项目中一些技巧总结
根据字段长度，返回相应的数据使用方式：<text style="font-size: 28px;">{{ addLabel(listItem.label) }}</text>addLabel(label) { if (!label) return ''; return label.length > 8 ? label.substring(0, 8) + '...' : label; },效果图...
2021-01-15 15:33:45
173
原创 react 水印
waterMark封装 直接引入export function watermark (options) { const { container = document.body, // 容器 width = '300', // canvas元素宽 height = '200', // canvas元素高 textAlign = 'left', // 文字对齐 textBaseline = 'bottom', // 基准线 fo
2021-01-07 15:31:03
408
原创 react 自己封装的组件获取不到history信息
1.只有通过路由配置的组件才能通过props获取路由信息2.如果是自定义的组件，没有通过路由配置，无法props获取路由信息3.通过高阶组件 withRouter包裹普通组件，普通组件就可以通过props获取路由信息//引入import React, { Component } from 'react';import { NavBar } from 'antd-mobile';import {withRouter} from 'react-router-dom';class TNavBar e
2020-12-27 10:15:46
998
原创 react 在componentDidUpdate中使用setState
componentDidUpdate()会在更新后立即被调用，首次渲染不会执行此方法。当组件更新后，可以在此处对DOM进行操作，如果你对更新前后的props进行了比较，也可以选择在此处进行网络请求。你也可以在componentDidUpdate()中直接调用setState()，但请注意它必须被包裹在一个条件语句中。componentDidUpdate(prevProps,prevState,snapshot)componentDidUpdate(prevProps,prevState){
2020-12-24 22:48:37
6947
原创 react配置绝对路径
在根目录添加文件：jsconfig.json{ "compilerOptions": { "baseUrl": "src" }, "include": ["src"]}配置完成后//原 ../../../assest/img/01.png可以改写成// assest/img/01.png
2020-12-24 22:06:51
380
原创 react 重定向Redirect
// 如果路径是 / 跳转到/home<Redirect exact from='/' to='/home'></Redirect>
2020-12-22 23:16:07
401
1
原创 react 编程式导航
场景：点击登陆按钮，登陆成功后，通过代码跳转到后台首页，如何实现编程式导航：通过JS代码来实现页面跳转history是React路由提供的，用于获取浏览器历史记录的相关信息push(path)：调转到某个页面，参数path表示要跳转的路径go(n)：前进或后退到某个页面，参数n表示前进或后退页面数量（比如：-1表示后退到上一页）注：通过Route配置的组件可以通过this.props接收到路由相关信息，会得到如下3个对象：history:用于跳转的（push、go、replace）matc.
2020-12-22 21:00:33
176
原创 react route和Switch的区别 +嵌套路由
Router：指定路由规则Router默认也是模糊匹配Router的path可以不写，如果不写，表示该组件一定匹配Switch：（选择 开关） Switch中只有一个组件能匹配，只会显示第一个匹配的组件// exact 表示精确匹配<Route path='/' component={Home} exact></Route>Switch配合没有path属性的Route可以实现404页面<Switch> <Route path='/' c
2020-12-22 20:37:36
3098
原创 react Link和NavLink的区别
NavLink会默认给当前匹配的元素添加一个类名：activeNavLink默认是模糊匹配，如果想要精确匹配，请用exact属性// exact:代表的是精确匹配，不会模糊匹配<NavLink to='/' exact></NavLink>
2020-12-22 20:08:36
607
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人