本来是想基于谷歌的firebase服务进行单页app开发，但是遇到了一些问题，但是大概的结构已经摸清楚了，经历了几天头痛欲裂的查看官方文档日子。。。痛并快乐着，又成长了许多。首先介绍一下目前已经做好的功能：功能用户注册用户登录无登录状态可获取公共内容，也就是书签书签分类添加书签二级分类添加书签具体信息添加，包括：logo，title，href三个值，并且增加了对应的表单验证书签分类修改&删除书签二级分类修改&删除书签信息修改&删除搜索功能用户登录后才允许出现新建和编辑功能用户登录有效期（暂时只设置了临时有效）目前就很潦草的开发了这些功能，因为一个人要做很多事情，还要阅读大量莫名其妙的文档...
在使用搜索跳转路由时我遇到了一个问题，我的使用要求是，当我在顶部搜索框输入文字并回车时，要跳转至搜索页，并且搜索页要根据我传入的路由的查询参数进行处理。首次运行的时候很正常，路由页面能够进入，处理也能进行。但是当我第二次的时候，也就是已经进入搜索页的情况下，再次回车搜索时，就会报错，因为我重复进入同一个路由页面了。那么第一个问题：如何避免重复进入同一个路由报错如何避免重复进入同一个路由报错找了半天发现一串有意思的代码：this.$router.push({query: {plan: 'private'}})也就是说，我们路由跳转的时候，只传一个对象，这个对象只包含qu...
Reach 基于Bootsarp4的响应式博客主题，目的是为了更好的阅读体验，更快捷的使用方式，更优质的UI而存在。预览图功能特性[x] todo列表[x] 目录树[x] 评论表情[x] 轮播[x] 面包[x] 分享功能[x] bnner轮播[x] 代码高亮[x] 图箱[x] 主题切换[x] 文章自定义缩略图[x] 图片预加载[x] loading动画[x] 天气......下一版开发进度[ ] 锁屏功能[ ] 新的缓存方式[ ] ......更新内容v1.1修复nav菜单链接不支持非伪静态增加手机端搜索评论表单样式优化天气功能增加文章样式微调loading加载动画图片预加载文章缩略图也...
终于把站点迁移过来了，期间遇到一些问题，很蛋疼，比如，把站点文件夹整个打包备份后，数据库也一并备份，然后还原的时候会遇到一个神奇的bug。你的邮件回复提醒功能再也无法生效了，哪怕你重新设置账户信息。[hide]数据库备份为此我试了好久，发现只有一个办法可以完美解决这问题，就是会比较麻烦一些，但是文章数据，评论，分类信息，标签都可以完美保留。我们的效果就是，博客的设置信息全部丢弃，只保留文章数据，评论，分类信息，标签。所以我们首先要进入数据库管理，找到对应的几个表：accesscommentscontentsfieldsmetasrelationships如果你用的是默认前缀，那么其完整表...
之前有一段时间我发现网站功能都加载完了，但是浏览器还是显示转圈，找了半天发现是个人的头像加载太慢了，于是今天特意去找了下有什么快速的源，于是看到了七牛的一个源...真香....233话不多说，上教程首先我们要打开typecho根目录配置文件config.inc.php,在里面加上这句话！/** 更换gravatar头像源*/ define('__TYPECHO_GRAVATAR_PREFIX__', 'https://dn-qiniu-avatar.qbox.me/avatar/'); 完事！如果你自己反代了源，也可以把https这个链接改为你自己的。
在写《MUFlow》主题的时候，我遇到一个很头疼的问题，就是点击分类会显示分类菜单，但是这个菜单还会有子级菜单，按照嵌套规则，我对这个子级的菜单元素，用一个div包裹，并且加上了class类名dropdown-menu，然后里面的内容就按照官方的标准书写，但是就出现了一个问题。当我点击子级菜单后，整个菜单都消失了。一脸蒙蔽，什么鬼，难道我做错了，什么情况，在不断的对照不同人写的例子后，我崩溃了，然后无意间看到开发者控制台的class变化后，我大概有点知道为什么了。当我点击子级菜单后，子级菜单对应的dropdown-menu元素是显示的，它的class有了show类名，但是一级菜单就没了，...
关于自定义字体，我一开始只以为只能本地加载，也就是css里面定义的字体，都只能从本地加载到，但是后来我了解到字符图标，一开始也是照本宣科使用本地字体，这就导致了一个问题，如果服务器网速带宽不够，就会产生字符字体文件未加载完整时，有一个占位字符显示，时间一长就显得极度的难看。然后我使用了阿里矢量字体库里面的字体，是可以直接下载一个css文件，然后本地引用，就可以直接用了，我就奇了怪了，怎么做到的，当然，这个疑问到今天也就完全明白了。首先要明确一点，阿里巴巴的那个css文件虽然写的很多，但是个人测试的时候好像也不支持ie9以下，也不知道是代码问题还是什么，不过现在能兼容ie11就不错了。自定...
很多项目里面会用到复制和粘贴两个功能，但是我平时也用不到，这里就详细学习一下是怎么运作的。剪贴板事件了解剪贴板有6个事件，其中现代浏览器火狐只支持三个，ie和谷歌则支持全部。事件名说明beforecopy复制事件触发之前触发copy复制beforecut剪切事件触发之前触发cut剪切beforepaste粘贴事件触发之前触发paste粘贴其中火狐浏览器只支持 copy，cut，paste三个事件。其中ie和谷歌浏览器的话是都支持的，并且在ie中使用右键菜单进行复制剪切粘贴的操作，事件会触发多次，而在现代浏览器中，你复制一次，只会触发一次copy事件和beforecopy事件这种，哪怕是右...
去年一时冲动买了追风者218，被迫买了一块itx主板，但是坑爹的因为垃圾风道搞得我显卡风扇坏了，然后又没有地方有卖风扇，新显卡又买不起，无奈走上了垃圾的不归路。首先我们看下娱乐大师跑分：这个分数玩网游，吃鸡，包括程序员代码，都不是问题了，甚至用于办公都游刃有余。配置：主板主板是去年买来闲置的七彩虹H110 pro v20;因为垃圾追风者被迫购买，后来换了先马米立方，itx就闲置了，过年的时候就一直想着怎么把这个板子用上，于是打起了itx的主意。主板带m.2固态接口，但是走的sata带宽，对于我来说足够了，因为我用了几年这种接口，做个系统完全足够，对于我这个半吊子小白前端就是ojbk。况且...
独立页面目前只做了友链和关于页面，像分类页和时间归档这些基本没什么用，也就没有做，而FAQ页面准备设置为主题的帮助页面，但是目前太忙也没来得及做，到时候更新的时候加上去。创建友链和关于页面：如果你之前也有独立页面并且不是下面两个，我建议是删除，不删除虽然也会在导航栏输出，但是进去不会有内容，本主题暂时只适配这两个独立页面，有能力者也可以自行开发友链撰写 --- 创建页面 --- 标题填：友链 --- 链接自定义填：links --- 自定义模板选：links截图忘记写了，友链右侧的页面顺序填1友链的内容格式为表格，md的写法，格式如下：| LOGO | 站点名称 | 站点...
一般来说，vue的本地资源引入是由index.html文件进行引入的，但是我做页面的时候遇到一个问题，就是在首页刷新没有问题，在其他路由页面刷新，就会出现报错，提示 某某某js文件或者方法不错在，或者资源文件，如css，img这些引入出错。原因就是因为引入时在开头加./，按道理来说，加这个也没有问题，因为在vue-cli3里面，index.html文件是和静态文件在同一个目录的，这样引入并不会报错。但是错也错在这里，由于打包后，目录结构发生了变化，之前的./可能无法正确的获取，所以解决办法就是不要.了。目录结构示意图：正确的引入方式：<link rel="styleshe...
一般我们认为启用history模式只是去掉地址栏的#符号，然后Nginx服务器为了实现这个效果需要添加一段代码用于支持该效果。但实际上并不是表面上那么简单，给Nginx添加这段代码后，我们可以直接在地址栏输入路由链接，从而进入到对应的路由页面，如果没有使用该段代码，地址栏的#号依旧会消失，但是你无法通过直接输入路由地址直接进入到对应的页面。代码：## 启用history模式（ 什么请求都只返回index.html） location / { try_files $uri $uri/ /index.html; }
升级到3之后，静态的文件都统一存放在public目录下，但是这个目录下，你在index.html的时候很好引入，在组件中，就不行了，因为webpack打包后路径就变了，所以我们要使用一个动态的参数。动态参数绑定这种情况一般出现在我们用v-for遍历一个对象，在对象里面会有对于的图片的地址，但是这个地址一般来说可能只写图片的名字，因为路径是一样的，直接在遍历的时候统一就行了，但是这个时候我们会发现地址是失效的。<img v-for="item in imgarr" :src="'../../images/'+item.src"...
逛高斯键盘官网的时候，应该是去年的时候，官网改版后有一个特效挺有意思的，就是数字跳动，之前一直没空研究，今天抽空去看了下，js有一个开源的插件：countUp.js 先看看高斯的效果图：效果就是这样，我们先去下载js文件CountUp.js下载完我们找到dist目录下的countUp.min.js文件，拿出来在你需要的项目中。再新建一个js文件，名称自定义，这里是用于调用countUp的，你可以命名为：start.counUp.js教程注意，使用该功能你需要一个服务器环境，本地直接打开是不行的!引用由于版本更新后，采用了es6的模块写法，引入js文件的时候需要注意不能使用传统的type属...
以前写过一篇关于字体渐变效果的文章，那时候初出茅庐，啥都不太懂，就只会个静态，这次逛animate.css网站的时候发现他的字体是动态渐变效果的，这就有点刺激了，于是研究了一下。效果图教程主要是利用了css3的滤镜效果，也就是hue-rotate()色调转盘，他会根据当前的颜色进行调整，大概可以理解为ps中的调整色相吧。 p { font-size: 60px; color: #f35626; background-image: linear-gradient(92deg, #f35626 0%, #feab3a 100%); -webkit-ba...
vue中绑定一个属性使用的是v-bind:指令，简写形式为:；使用该指令可以绑定data中的key，从而获取它对于的value值，但是这个绑定它是单向的，如果你元素本身修改了内容，并不会影响到data中对于的值。在与表单的交互中只有单向绑定是不实用的，于是有了双向绑定，我们可以给一个input表单元素通过v-model双向绑定一个key，并且当我们修改input中的内容时，绑定的值也会跟着发生变化。其原理也非常简单。v-model绑定：<input type="text" v-model="name" />v-mode原理<inp...
css控制文本溢出隐藏css兼容最好的就是单行文本溢出省略号了，我们先看下单行的css是怎么设置的：p { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }表示文本不换行，做一行显示，然后文本超出p元素的宽度做省略号显示，且为了兼容低版本浏览器加了超出部分裁剪的css效果。这个就是一个基本的文本溢出省略号显示的一个效果。但是，单行已经不能满足我们日常所需了，在一些文本简介中，我们都希望的是能够有多行的显示，再多则做省略号显示，这个功能目前来说，只有webkit内核的浏览器支持这个效果，i...
这个class是需要配合一个js文件才有效果，主要就是检查浏览器是否支持css3和html5的特性，通过js的一些操作，减少不同浏览器之前的差异。配合modernizr.js文件，该文件需要在head标签中引用。modernizr官网引用后给html标签加上class<html class="no-js">当然，我没有去测试这个东西，只是作为一个知识去了解一下，因为typecho的官方默认主题就用了这个class，但是他没有对应的效果，也没有引入modernizr，而是使用html5shiv，加上我写主题，本着懂的地方我就可以动，不懂就不动的做法，这个cl...
百度搜索举报系统就是个摆设，明明写了，如果站点被恶意镜像是可以通过举报反馈的，搜博客名恶意网站都顶到前头来了，结果两次举报毫无效果，回复统一，从回复的内容上看，摆明了就是不管你的死活，呵呵.....既然垃圾内容能够得到保护，而辛苦的原创者只能成为案板上的肉，任人宰割，还能得到保护，容我说一句，百度倒闭，指日可待！垃圾内容充斥着搜索页，这种东西不用也罢！以防人家以为我瞎掰，这里放上截图，给你们看看百度是怎么处理的。话也不多说，垃圾的东西就是垃圾，恶心，大家做网站记得防范一下那些恶意反代的。
图是我目前主题使用的样式，但是插件不带任何ui样式，他只有三个参数选项，通过传入的success函数进行天气数据对象的操作。更新2020-2-25新增高德ip定位，增加准确性！参数参数类型说明baidukeystring百度普通ip定位开发者keyamapkeystring高德天气开发者keysuccessfunction接受一个参数，该参数为返回的天气数据对象，具体可以查看高德天气说明我们先看下success接受的data是什么东西可以看到他就是一个键值对的对象，可以通过点方法调用到对应得值。调用方法 $.reachweather({ baidukey: '百度开发者...
最近评论