VSCode 集成 ESLint 和 Prettier 情景ESLint 是一个前端代码质量检测工具,然而配置非常非常非常的麻烦(前端的配置真的是超多呢),所以在吾辈的 VueJS 项目中直接使用了 standard 规则。然而问题在于有了代码规则,还需要自动的格式化,否则为了手动格式化是一件极其痛苦的事情。。。 步骤VSCode 安装下面三个插件 Vetur ESLint Prettier - Code formatter 然后在 User Se
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
MySQL 无法插入中文数据 刚刚在 Linux Centos 装完 MySQL 后,想试一下是否能正常使用,但在插入中文数据时发生了下面的这个错误。 1[HY000][1366] Incorrect string value: '\xE7\x90\x89\xE7\x92\x83' for column 'name' at row 1 感觉是 MySQL 编码问题,查看一下编码格式 1show variables like