MiTu-小书童

瞎写

发表于 2018-05-17 分类于随笔阅读次数： Valine：

批评你不可怕，对你失望才可怕

早晨被旁边地铁施工地上很有节奏的钻地声给惊醒（神奇的是，梦里也同样听到了节奏的敲打声），抬头看了下挂钟才7点多，我强迫自己再睡会儿，毕竟好不容易赚来周末懒觉的机会。

人往往是这样，强迫自己越不在乎的东西，却越会关注，尤其是钻地的节奏仿佛心脏跳动的频率，整得我难受。既然这样，那行吧，我就用手机的音乐来强行覆盖它。

还是没用，惹不起，那总还是躲得起。穿衣，刷牙，洗脸，收拾东西，出门。带上了电脑和一本五月份计划要看完的书。

阅读全文 »

2018，重新出发

发表于 2018-01-02 分类于随笔阅读次数： Valine：

2017，是时候说再见了

按宁哥的说法，2017，我一事无成

无力反驳却机智如我回了俩字儿：蛰伏

但回想过去这一年，还是有很多想要说

这一年，有很长一段时间，犹豫和纠结让负面情绪充斥着我全身，温柔的人呀都悄悄替我接收了，感谢你们，感谢坤哥坤嫂，能听我唠唠嗑

这一年，接受自己平庸的那一刻是什么情境？（当我拥有了更开阔的眼界，更高一点的格局，我觉得曾经骄傲的我就像只井底之蛙。而我又不太愿意接受自己是平庸的）而我承认自己的工作效率低下，承认自己一直处于安稳的状态，也承认自己的碌碌无为。也许别人看来自己是相当的努力，但是，这种努力是井底之蛙的努力，工作也是浮浅工作，而不是深度工作。只有承认自己的平庸，才能脚踏实地，表现的再谦逊一些，就像乔帮主所说的那样，stay hungry stay foolish

阅读全文 »

Vue 组件间通信

发表于 2017-11-13 分类于技术渣阅读次数： Valine：

分两种，父子组件与非父子组件的通信

父子组件通信

首先要明白，在 Vue 中，父子组件的关系可以总结为 prop 向下传递，事件向上传递

也就是说父组件通过 prop 给子组件下发数据，子组件通过事件给父组件发送消息

注：如果你想把一个对象的所有属性作为 prop 进行传递，可以使用不带任何参数的 v-bind(即用 v-bind 而不是 v-bind:prop-name)。例如，已知一个 todo 对象：

todo: {
   text: 'Learn Vue',
   isComplete: false
}

然后：

1	<todo-item v-bind="todo" />

将等价于：

1	<todo-item v-bind:text="todo.text" v-bind:is-complete="todo.isComplete" />

通过 Vue 的自定义事件来解决子组件给父组件发送消息

每个 Vue 实例都实现了事件接口，即：

使用 $on(eventName) 监听事件
使用 $emit(eventName) 触发事件

PS：在项目中有时也会碰到父与子孙组件的通信，这时，需要在子组件中给对应的数据添加 watch 来时时响应才行

非父子组件通信

有两种办法解决：

一、组件间相对简单情况下

有时候，非父子关系的两个组件之间也需要通信。在简单的场景下，可以使用一个空的 Vue 实例作为事件总线：

var bus = new Vue();
// 触发组件 A 中的事件
bus.$emit('id-selected', 1);
// 在组件 B 创建的钩子中监听事件
bus.$on('id-selected', function(id) {
  // ...
});

这个时候，可能我们就需要定义一个全局变量来分配各个组件间的通信事件

二、组件复杂的情况下

官方文档推荐考虑使用专门的状态管理模式（Vuex）。

不向静中参妙理，纵然颖悟也虚浮

发表于 2017-09-18 分类于随笔阅读次数： Valine：

围棋界著名的一句诗：弗思而应诚多败，信手频挥更鲜谋，不向静中参妙理，纵然颖悟也虚浮。

意思大概是平时不去打好基本功，纵然在对弈之时下出妙子也无非是偶然而已，可理解为须寂寞清静才能达到深远的境界。

这句话用我的白话文来说就是，不要心浮气躁，必须得脚踏实地，即使你想建造一座宏伟的高层建筑，那也必须要把根基打结实才行。就像大学期末考试一样，你考 60 分，也许只是最后两周临时抱佛脚的功劳，但是，真正这门课你的掌握度也许只有 20%，甚至都还不到。到了社会，当你面试的时候(尤其是技术相关)，也许这 60 分的能力你能骗过小部分人，但是，一个对知识体系非常清晰，沉淀很深的面试官而言，你只不过是一只三脚猫而已。

阅读全文 »

JavaScript 提升

发表于 2017-09-14 分类于技术渣阅读次数： Valine：

这里的提升，我的理解是包括变量和函数在内的所有声明的提升
而根据对作用域的理解，任何声明在某个作用域内的变量，都将附属于这个作用域。

考虑以下代码

//代码块一
a = 2;
var a;
console.log(a);

//代码块二
console.log(a);
var a = 2;

上述两段代码的结果是啥？

思考思路：包括变量和函数在内的所有声明都会在任何代码被执行前首先被处理。

变量声明

于是，上述代码块一，会以如下形式处理：

1
2
3

var a;
a = 2;
console.log(a);

代码块二处理：

1
2
3

var a;
console.log(a);
a = 2;

函数声明

foo();
function foo() {
  console.log(a); //undefined
  var a = 2;
}

阅读全文 »

JavaScript 作用域/scope

发表于 2017-09-13 分类于技术渣阅读次数： Valine：

什么是作用域？

百度百科：程序设计概念，通常来说，一段程序代码中所用到的名字并不总是有效/可用的，而限定这个名字的可用性的代码范围就是这个名字的作用域

书面版：一套设计良好，用来存储变量，并可以方便找到这些变量的规则称为作用域

RL 查询

var = 2;

RHS：谁是赋值操作的源头，查找变量 a 的值，即 2。
LHS：赋值操作的目标是谁，试图找到变量的容器本身，从而可以对其赋值。也就是查找变量 a 。

console.log(a); // 这里对 a 是一个 RHS 查询，找到 a 的值，并 console.log 出来。
a = 2; // 这里对 a 是一个 LHS 查询，找到 变量 a，并对其赋值为 2 。

function foo(a) {
  console.log(a); // 2
}
foo(2);
// 这里首先对 foo() 函数调用，执行 RHS 引用，即找到 foo 函数，
// 然后，执行了 a = 2 的传参赋值，这里首先执行 LHS 查询，
// 找到 a 并赋值为 2，然后 console.log(a) 执行了 RHS查询。

阅读全文 »

Jquery+Bootstrap构建传统后台管理系统

发表于 2017-09-10 分类于技术渣阅读次数： Valine：

现在流行的是前后端分离，MV*模式，我作为一个相对传统行业的老菜鸟来说说最近手上的一个后台管理系统项目的前端工作，欢迎提各种意见。

项目背景

传统后台管理系统，面向的是企业级客户，兼容 IE8+等主流浏览器，所以对界面友好程度相对来说并不是太大，你懂得

前端框架(类库)

Jquery+Bootstrap+Layer+zTree+Validform

谈框架这种高大上的东西，我更想用类库来表达(恩，因为我觉得自己对框架这个概念的认识还很浅)，没错正如标题所言，由 jq+bootstrap 构建，再新增一个皮肤包，根据 UI 出的视觉稿进行编码，就将其称为个性化，换肤功能吧。

公共 CSS

在 css 公共调用上，我又添加了一些简单字体大小，间距等等

定位

.pos-r {
  position: relative;
}
.pos-a {
  position: absolute;
}
.pos-f {
  position: fixed;
}

文字溢出省略号

.single-overflow {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.text-overflow {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  padding: 0 2px;
}