如何在自己博文中自动跳转到其他链接位置
有些小伙伴看我的博客中有自动跳转到其他博文的内容,感觉很厉害
甚至有同学感叹到:这也太好了吧!
不多BB,直接上代码123<script>window.location.href='https://victorfengming.gitee.io/2019/09/blog-href/';</script>
简单解释(不用仔细看)其实原理很简单,说破了就感觉很low了
首先,在jekyll的模板中,markdown文件中可以嵌入html标签,在最终的页面上会被渲染成为页面中的元素内容
所以,script标签他也不例外,这样我们只需要在文档加载时,直接进行js的跳转动作就行了
这样你直接将我上面的代码粘贴到你的博客的模板中的md文件中,就直接就成了(其中href后面的地址可以根据你自己的地址来进行更改)
这个小功能看似没什么用,但是对于一些喜欢fock其他人博客的同学,这简直就是神奇的工具啊!!!
sublime一键格式化
1.使用快捷键ctrl+shift+p调出控制台,输入install package,然后输入html-css-js prettify,进行下载2.下载完成后,在preference打开package settings,会出现如下内容:html-css-js prettify安装成功。3.具体的快捷键在preference > package setting > html/css/js prettify > keyboard-shortcuts-default中注意:容易出现的错误!博主第一次使用时,按下ctrl + shift +h并没有奏效,发现这插件依赖node.js,所以要下载node.js(下载node.js不要等级太低)node.js下载地址:http://nodejs.cn/download/下载后使用cmd,进入下载的目录,使用node.exe --version这样node.js就安装成功了!然后在sublime中的preference > package setting > html/css/js prettify > ...
sublime快捷键和设置配置
起步很多小伙伴使用jetbrains系列的编辑器后,在使用轻量级的sublime,可能会有一些设置和快捷键习惯不适应小编今天就给大家一些常用的sublime设置和快捷键的配置
设置12345678910111213141516171819202122232425{ // 颜色主题 "color_scheme": "Packages/Color Scheme - Default/Monokai.sublime-color-scheme", // 自动保存 "expand_tabs_on_save": true, // 字体大小 "font_size": 18, "ignored_packages": [ "Vintage" ], "save_on_focus_lost": true ...
Vue CLI的安装
关于旧版本 Vue CLI 的包名称由 vue-cli 改成了 @vue/cli。
如果你已经全局安装了旧版本的 vue-cli (1.x 或 2.x),你需要先通过 npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸载它。
Node 版本要求 Vue CLI 需要 Node.js 8.9 或更高版本 (推荐 8.11.0+)。你可以使用 nvm 或 nvm-windows 在同一台电脑中管理多个 Node 版本。
可以使用下列任一命令安装这个新的包:
npm install -g @vue/cli
# OR
yarn global add @vue/cli
安装之后,你就可以在命令行中访问 vue 命令。你可以通过简单运行 vue,看看是否展示出了一份所有可用命令的帮助信息,来验证它是否安装成功。
你还可以用这个命令来检查其版本是否正确 (3.x):
vue --version
如果显示出了版本号的信息,即表示vue安装成功
初始化vue项目并启动
初始化vue项目项目起名为vue-playlist
1victor@asus:~/WebstormProjects/vuejs/vue_demo2$ vue init webpack vue-playlist
确认项目名字,这里我们直接就一个回车,默认的名字不用改
1? Project name vue-playlist
下面是添加对于项目的描述
1? Project description Vue基础知识
作者的信息,默认就行了,直接就一个回车
1? Author fengming <victorfm@163.com>
1? Vue build standalone
下面的对于我们新手来说暂时不需要,直接就一个no就行了哦
1234? Install vue-router? No? Use ESLint to lint your code? No? Set up unit tests No? Setup e2e tests with Nightwatch? No
这里问我们是否运行npm来创建项目
12345? Should we run `npm instal ...
Vue的项目目录解析
废话不多讲,直接就一个表格
目录/文件
说明
build
项目构建(webpack)相关代码
config
配置目录,包括端口号等。我们初学可以使用默认的。
node_modules
npm 加载的项目依赖模块
src
这里是我们要开发的目录,基本上要做的事情都在这个目录里。里面包含了几个目录及文件:
assets: 放置一些图片,如logo等。
components: 目录里面放了一个组件文件,可以不用。
App.vue: 项目入口文件,我们也可以直接将组件写这里,而不使用 components 目录。
main.js: 项目的核心文件。
static
静态资源目录,如图片、字体等。
test
初始测试目录,可删除
.xxxx文件
这些是一些配置文件,包括语法配置,git配置等。
index.html
首页入口文件,你可以添加一些 meta 信息或统计代码啥的。
package.json
项目配置文件。
README.md ...
ES6中的const命令
const声明一个只读的常量。一旦声明,常量的值就不能改变。
12345const PI = 3.1415;PI // 3.1415PI = 3;// TypeError: Assignment to constant variable.
上面代码表明改变常量的值会报错。
const声明的变量不得改变值,这意味着,const一旦声明变量,就必须立即初始化,不能留到以后赋值。
12const foo;// SyntaxError: Missing initializer in const declaration
上面代码表示,对于const来说,只声明不赋值,就会报错。
const的作用域与let命令相同:只在声明所在的块级作用域内有效。
12345if (true) { const MAX = 5;}MAX // Uncaught ReferenceError: MAX is not defined
const命令声明的常量也是不提升,同样存在暂时性死区, ...
ES6中的let命令
基本用法ES6新增了let命令,用来声明变量。它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效。
1234567{ let a = 10; var b = 1;}a // ReferenceError: a is not defined.b // 1
上面代码在代码块之中,分别用let和var声明了两个变量。然后在代码块之外调用这两个变量,结果let声明的变量报错,var声明的变量返回了正确的值。这表明,let声明的变量只在它所在的代码块有效。
for循环的计数器,就很合适使用let命令。
1234for (let i = 0; i < 10; i++) {}console.log(i);//ReferenceError: i is not defined
上面代码中,计数器i只在for循环体内有效,在循环体外引用就会报错。
下面的代码如果使用var,最后输出的是10。
1234567var a = [];for ...
ES6中let和var的区别
原文链接
let是在ES6中新引入的关键字,用来改进var带来的各种问题。
let和var相比,大致有下面几个方面的不同:
作用域
通过let定义的变量,作用域是在定义它的块级代码以及其中包括的子块中,并且无法在全局作用域添加变量。
通过var定义的变量,作用域为包括它的函数作用域或者全局作用域。
function varTest() {
var x = 1;
if (true) {
var x = 2; // same variable!
console.log(x); // 2
}
console.log(x); // 2
}
function letTest() { let x = 1; if (true) { let x = 2; // different variable console.log(x); // 2 } console.log(x); // 1}// let 无法在全局作用域中定义变量var x = ‘g ...
Vue指令大全
Vue指令大全
2
2018.06.06 12:49:13
字数 1222
阅读 28624
1. v-text v-text主要用来更新textContent,可以等同于JS的text属性。
<span v-text="msg"></span>
这两者等价:
<span>{{msg}}</span>
2. v-html 双大括号的方式会将数据解释为纯文本,而非HTML。为了输出真正的HTML,可以用v-html指令。它等同于JS的innerHtml属性。
<div v-html="rawHtml"></div>
这个div的内容将会替换成属性值rawHtml,直接作为HTML进行渲染。
...