- 博客(47)
- 收藏
- 关注
RSS订阅原创 Nuxt项目总结
SEO为了使我们的站点更容易被搜索到，或者说在搜索引擎的排名中靠前，那就需要能让爬虫尽可能多的爬到我们的页面，那就需要对站点进行搜索引擎优化，也就是我们所说的SEO爬虫原理简单过程：爬取url -> 解析html内容 -> 对内容进行检测 -> 将符合收录规则的网页存储下来该网页将会出现在与网页内容相关的查询的搜索结果中。收录方式：1. 主动发现并抓取2.每个搜索引擎都有提供链接提交的工具，通过主动推送功能将我们站点的网页收录到爬虫中方案决定基于
2022-01-19 18:31:51
1827
原创 去php项目重构小结
前言当一个已经五年甚至更久没有人维护的php项目，因众多客服问题且难以维护，突然重新启动，需要进行前后端分离重构时，我们需要思考些什么？思考1第一个问题，全量重构 or分模块重构？全量重构优点：可以完全抛开老项目，不用考虑与老项目的逻辑、交互耦合问题，负担最小缺点：对于一个功能丰富的系统来说，全量重构开发周期太长，不利于产品迭代开发。分模块重构优点：可根据功能和优先级安排重构模块的先后顺序；重构效果可更快上线以得到用户反馈缺点：需考虑与当前数据、交互、逻辑的兼容.
2021-11-01 15:12:30
402
原创 微信公众号开发小结
开启公众号开发者模式 | 微信开放文档准备工作 服务器配置 url：格式为http://外网IP/wx，端口必须为80端口token：和微信服务器约定好的一串字符串，区别于access_token，只用于验证开发服务器 验证token 提交信息后，微信服务器将发送GET请求到填写的服务器地址URL上，若验证成功，则说明验证成功验证过程如下：微信数据通信微信向服务器推送的消息格式为XMLMsgType主要有：event,text,image,v...
2021-09-15 19:35:39
423
原创 学习
1. el-dialog中的组件或内容想关闭后每次初始化<el-dialog :visible.sync="showCron" v-if="showCron"></el-dialog>el-table中设置height后 合计行不显示getSummaries(param) { // 增加代码 start this.$nextTick(() => { this.$refs.table.doLayout(); }); /...
2020-06-28 13:48:27
177
原创 登录后重定向到原先路由（带参数）
入口文件：在监听路由改变前，对token进行判断，当需要跳转到登录页时，需要带上上一个页面的路由信息router.beforeEach(async (to, from, next) => { NProgress.start(); document.title = getPageTitle(to.meta.title); const hasToken = getToke...
2020-04-10 14:42:05
5126
原创 js 判断是否滚动条滚动到底部
const homeDom = document.querySelector('.home'); homeDom.addEventListener('scroll', function() { console.log('scrollHeight', this.scrollHeight); // 内容总高度（内容可视区域 + 滚动条Y轴滚动距离） console.log('scro...
2019-12-31 15:11:33
772
原创 npm全局下载模块包后，却提示不是内部或外部命令，也不是可运行的程序
在用户变量中的PATH中新增一条：D:\Users\xxx\AppData\Roaming\npm根据本机npm安装位置而定
2019-12-31 11:18:33
867
原创 vue单页面应用中增加js脚本
将js文件放入public文件夹,并在其中的index.html中增加注: 打包后的js文件也会在dist的根目录下<script type="text/javascript" src="<%= BASE_URL %>xxx.min.js"></script>BASE_URL- 会和vue.config.js中的publicPath选项相...
2019-12-31 10:31:14
1204
原创 react g2
单折线const baseLineData = [ { year: '1991', value: 3 }, { year: '1992', value: 4 }, { year: '1993', value: 3.5 }, { year: '1994', value: 5 }, { year: '1995', value: 4.9 }, { year: '1996',...
2019-12-15 21:33:49
482
原创 vue 消息无缝滚动
<div class="fix-vote"> <div class="vote-list-box" :class="{ anim: animate }"> <div class="vote-item" v-for="(item, index) in voteList" :key="index"> <span>{{ item....
2019-12-08 21:07:56
173
原创 vue-cli3中使用rem自适应
安装npm install postcss-px2rem --save在vue.config.js中增加配置const px2rem = require('postcss-px2rem');const postcss = px2rem({ remUnit: 75 // 基准大小 baseSize，需要和rem.js中相同})module.exports = { ...
2019-12-07 21:30:28
1138
1
原创 element-ui table中有fixed列后出现高度不对的情况
最后一列为fixed属性时，高度会出现未占满父元素的整个高度，因此会出现一条灰线解决方法：在<el-table>标签上加一个class="table-fixed"在样式文件中增加如下css代码（利用样式穿透）.table-fixed { /deep/ .el-table__fixed-right { height: 100% !important; //设...
2019-12-04 16:58:20
10535
3
转载 keep-alive和router-view的结合
<keep-alive>是Vue的内置组件，能在组件切换过程中将状态保留在内存中，防止重复渲染DOM。<keep-alive>包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。<keep-alive>与<transition>相似，只是一个抽象组件，它不会在DOM树中渲染(真实或者虚拟都不会)，也不在父组件链中存在，比如：你永远在...
2019-12-04 16:50:38
923
原创 React + antd 实现左侧多级菜单栏
routers.jsimport News from '../components/News';import ProductList from '../components/ProductList';import User from '../components/User';import UserList from '../components/UserList';import Us...
2019-09-12 17:00:35
5445
3
原创 利用margin负值实现多列等高
<div class="container"> <div class="left-box"> 左侧内容<br> 左侧内容<br> 左侧内容<br> 左侧内容<br> </div> <div class="right-box"> 右侧内容<br> 右侧内容<br...
2019-09-05 18:04:09
158
转载 footer 吸底效果
预期的效果：（1）当内容较少（不足以占满可视区域）时，footer置于可视区域的底部（2）当内容过多（超出可视区域）时，footer置于页面的最底部<div class="container"> <div class="wrap clearfix"> <div class="content"> <p class="li...
2019-07-12 16:15:05
743
转载 async/await与异步
async checkNum() { let num = Math.floor(Math.random() * 10); if (num < 5) return { result: true, num }; else throw { result: false, num };}this.checkNum().then((data) => { console.log(`...
2019-07-11 16:53:17
106
转载 ES6 Promise的基本认识
promise中一般是处理一些异步事件，包括resolve和reject两个参数resolve表示执行成功的回执，reject表示执行失败的回执promise的默认状态为Padding，reolve则是将promise的状态变为Fullfilled, reject是将状态变为Rejected示例：getNumber() { return new Promise((resolve...
2019-07-11 15:03:10
173
转载 js的回调队列和事件循环
console.log('start'); setTimeout(() => { console.log('timeout');}, 0);console.log('end');执行顺序：1. 执行进入console.log('start')，将其放入调用栈中2.console.log('start') 后执行return，弹出栈顶3. 执行进...
2019-07-11 11:04:40
717
原创 CSS实现文本两端对齐
text-align: justify实现两端对齐文本效果。但是对最后一行是无效的（因此对单行文本也是无效的）， 那要实现上面的效果，我们就要新增一行，使其不再是最后一行。<template> <div style="padding: 100px;"> <div class="item"> <span ...
2019-06-14 11:31:10
2003
原创 加载进度条demo
<template> <div class="progress-box"> <div class="container"> <div class="loading-icon" ></div> <div class="loading-bar"> <div class...
2019-06-13 17:18:22
205
原创 Vuex 购物车demo
文件结构 App.vue<template> <div id="app"> <h3>Shopping Cart Demo</h3> <hr> <h4>Products:</h4> <ProductList /> <hr> ...
2019-06-12 17:16:09
245
转载 call、apply和bind的用法
在JavaScript中，call、apply和bind是Function对象自带的三个方法共同点：（1） 都是用来改变函数的this对象的指向的（2）第一个参数都是this要指向的对象，也就是想指定的上下文（3）都可以利用后续参数传参区别：bind是返回对应函数，便于稍后调用；apply、call则是立即调用1. callcall([thisObj[...
2019-06-10 10:21:33
144
原创 React中的this
class Button extends React.Component{ constructor(props) { super(props); } increament() { this.setState({ count: this.state.count + 1 }) } render() { return (<b...
2019-06-03 16:30:55
137
转载 display: inline-block带来的问题
情景一：两个相邻的inline-block元素（其中一个元素中有内容），出现了高度偏差的问题<div class="inline-box"> <span></span> <span>1</span></div>.inline-box span display: inlin...
2019-05-30 10:58:49
646
转载 美化浏览器滚动条样式
::-webkit-scrollbar-track-piece //滚动条凹槽的颜色，还可以设置边框属性 background-color: #f8f8f8::-webkit-scrollbar //滚动条的宽度 width: 8px height: 8px::-webkit-scrollbar-thumb //滚动条的设置 background-color: #ddddd...
2019-05-15 11:41:45
749
原创 iview render函数中监听on-change方法
render: (h, params) => { return h('Select', { on: { 'on-change': (value) => { consle.log('change value', value); } } })}
2019-04-17 20:26:34
4538
原创 iview组件中增加title
Select组件<Select transfer :title="name" clearable> <Option v-for="item in list" :key="item.code" :value="item.code">{{ item.value }}</Option></Select>Transfer...
2019-04-17 20:21:22
1271
原创 js 下载Base64图片
// 下载base64图片// content: Base64数据, fileName: 文件名downloadFile(content, fileName) { let aLink = document.createElement('a'); let evt = document.createEvent('HTMLEvents'); // initEvent 不加...
2019-04-17 20:07:25
294
转载 前端js读取文件内容
<input v-if="isShowFile" type="file" id="file" @change="onFileChange"/>onFileChange(files) { if (files.length) { var file = files[0]; var reader = new FileReader(); //...
2019-04-17 20:00:55
5553
转载 Vue iview 将树形结构中的父子节点Node转换成新的树形结构
// 获取当前选中的所有父子节点（数组）let sourceNodeList = this.$refs.tree.getCheckedAndIndeterminateNodes();if (sourceNodeList.length > 0) { let result = this.translateDataToTree(JSON.parse(JSON.stringify(s...
2019-04-17 19:42:52
1289
原创 Vue 复制内容到粘贴板
安装vue-clipboard2插件npm install vue-clipboard2 --savemain.js中注册import VueClipboard from 'vue-clipboard2';Vue.use(VueClipboard);具体使用<Button type="primary" v-clipboard:copy="sqlStr"...
2019-04-17 19:16:33
705
原创 vue中的样式穿透
组件内的结构如下：<template> <div class="box"> <Input class="input-test" type="text" /> <Input type="text" /> </div></template><script>ex...
2019-03-28 11:22:46
2359
原创 git的基本用法
// 创建SSH Key$ ssh-keygen -t rsa -C "xxx@xxx.com"// 查看全局配置$ git config --list// 查看具体配置（如：用户名、邮箱）$ git config user.name$ git config user.email// 修改全局配置$ git config --global user.name 'xxxxx'...
2018-10-20 15:00:43
153
原创 Vue中的树形结构
利用递归Main.vue<template> <div> <ul v-for="leave in demoData" :key="leave.name"> <menu-item :leave="leave"></menu-item> </ul>
2018-10-20 12:32:03
1813
转载 sticky footer的两种解决方式
sticky footer的特征如果页面内容不够长的时候，页脚块粘贴在视窗底部；如果内容足够长时，页脚块会被内容向下推送。1. 利用margin-bottom的负值
2018-06-28 20:21:27
305
原创 Vue2.0 仿饿了么商家详情页面笔记（三）
开始使用stylus（1） 安装报错：Cannot find module ‘stylus’ 解决方法：安装stylus 和 stylus-loader在项目根目录中执行npm install stylus --savenpm install stylus-loader --save（2）基本使用<style lang="stylus" rel="stylesheet/stylus" ...
2018-06-24 17:45:16
641
原创 Vue2.0 仿饿了么商家详情页面（二）
同history.go, router.go接受的参数应该为Number， 例如：// 上一页history.go(-1)router.go(-1)而你应该使用的是 router.push
2018-06-20 23:28:47
1368
1
原创 Vue2.0 仿饿了么商家详情页面（一）
已经很久没有做过这种h5的页面了，布局、css之类的都忘的差不多了。最近学了一点vue，顺便温故一下前端的基础知识，就拿这个饿了么的页面来练个手。即将遇到的问题滚动到指定位置后，固定导航栏页面的自适应问题（布局、字体等）滚动、滚动条footer固定在底部页面缓存（避免重复渲染）动画 效果菜单切换（路由）...
2018-06-19 11:07:34
2070
1
原创 Vue-cli安装及创建项目步骤
安装vue-cli脚手架安装node安装淘宝镜像cnpm（npm install -g cnpm --registry=https://registry.npm.taobao.org）安装webpack（npm install webpack -g）安装vue-cli（npm install vue-cli -g），注：这里查看版本的命令vue -V（大写）创建vue-cli项目在要创建项目的目录...
2018-06-10 22:37:10
330
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人