Vue 实现一个滚动到顶部的悬浮图标组件
场景吾辈在写 vuejs 前端项目的时候，需要实现一个下拉文章列表时，出现一个悬浮按钮，用于一键回到文章顶部。 实现 实现源码放到了 GitHub，Demo 演示 想直接看源码/效果的人可以直接去看，但最好看一下 注意点 思路 定义一个 vuejs 组件，抽取出最需要的几个属性（位置，组件的样子） 监听窗口滚动，当滚动到第二屏的时候显示组件 监听组件点击，点击即逐渐减少与顶端的距离 当在滚动中用
Vue 打包的静态文件不能直接运行
问题吾辈使用 vue-cli 直接生成的 vue 模板项目，在模板之上继续开发的。然而在使用 npm run build 打包项目时，却发现打包好的项目在浏览器中直接打开好像什么都没有？ 原因查看了一下打包后的 index.html 源码，终于发现了一个重要的点： 所有涉及到路径的地方全都是以 / 开头的 下面是吾辈打包后生成的 dist 目录 1234567891011121314151617
Vue 深度监听
场景吾辈在前端项目中需要监听 Vue 组件中的一个数组的变化，然而没想到这个简单的功能却发现并没有想象中的容易。在废了一波三折之后终于算是实现了效果，所以便在这里记录一下。 代码 吾辈写一个 demo 在 GitHub，如果需要可以去看下。也有一个 网站 用来演示下面的三种方法的效果 12345678910111213141516171819202122232425262728293031323
Vue 自定义标签的 src 属性不能使用相对路径
场景吾辈在使用 Vuetify 时突然遇到的，明明 img 标签就可以使用相对路径获取到图片，而 Veutify 的组件 v-img 却不能使用。 如下面 3 种加载图片的方式 123456<!-- 正常加载 --><v-img :src="require('../../assets/logo.png')" /><!-- 无法加载 --><v-img sr
Vue 实现一个简单的瀑布流组件
场景在用 Vue 写前端的时候，需要实现无限滚动翻页的功能。因为用到的地方很多，于是便想着抽出一个通用组件。 实现 实现源码放到了 GitHub，Demo 演示 想直接看源码/效果的人可以直接去看 思路 定义一个 vuejs 容器组件 抽离出公共的属性（加载一页数据的函数/每个元素的模板） 在父容器中遍历每个元素并绑定到传入的模板上 监听滚动事件，如果不是最后一页就加载下一页 重新渲染集合元素
点击按钮自动提交了 Form 表单
场景在吾辈的写 HTML 时遇到了一个问题，一个普通的按钮，点击之后一旦在 click 事件中进行了 return，则立刻提交 Form 表单。 像下面这段代码，不管是点击 修改按钮 还是 提交按钮，Form 表单都会被提交（可以看到 alert 弹框）。 12345678910111213141516171819<form action="" id="form" onsubmit="sub
Windows 下 MongoDB 便携版安装与初始化
官网 下载 下载位置 选择一个便携版本下载（.zip 结尾），例如吾辈选择的就是 win32/mongodb-win32-x86_64-2008plus-ssl-4.0.1.zip 配置环境变量下载完成后解压到本地，将 /bin/ 目录添加环境变量 Path 中以方便使用 mongodb 的命令。 配置完成后验证一下 1mongo -version 如果环境变量配置正确的话会有类似于下面的
MySQL 创建用户及授权
用户创建用户使用 root 用户登录到 MySQL 12CREATE USER rxliuli IDENTIFIED BY '123456'; 删除用户1DROP USER rxliuli; 授权添加授权命令格式： 1GRANT privilegesCode ON dbName.tableName TO username@host IDENTIFIED BY "password"; 例如下
MySQL 使用 IF 判断是否执行 SQL
语法if(condition, value_if_true, value_if_false) 上面的三个参数的意思是，如果 condition（表达式）为 true，则执行表达式 value_if_true，否则执行表达式 value_if_false。 例如有下面这个 User 用户表： 123456789CREATE TABLE User ( name VARCHAR(10) NOT NUL
MySQL 字符串数字比较大小的问题以及解决方案
为什么要写这篇文章呢？因为吾辈碰到了 MySQL 中字符串数字比较起来的坑。 字符串数字：明明是数字却在数据库中使用 varchar 等类型进行存储的数字。 例如以下的表结构： 1234567CREATE TABLE test_table ( id BIGINT NOT NULL COMMENT 'id', int_str VARCHAR(200) NOT NULL