有时候也需要在内联语句处理器中访问原始的DOM事件，可以使用$event把它传入方法
例子：
<button v-on:click="warn('Form cannot be submitted yet.', $event)">
Submit
</button>
// ...
methods: {
warn: function (message, event) {
// 现在我们可以访问原生事件对象
if (event) event.preventDefault()
alert(message)
}
}
使用benchmark.js进行前端代码基准测试
验证
使用git status查看状态
使用git add 将上面status中打印出来的路径放在后面即可
今天主要的学习成果有：
- less的学习
- 动画效果的设置
Less的总结的话，还是看上面那篇文章先，现在总结还为时过早（需要多踩坑）
动画效果的总结
首先是slot的学习，今天的一个业务是需要往子组件中添加一个按钮，但是这个子组件需要放在父组件中（方便操作），需要怎么做呢？？
可以是用具名插槽slot
子组件中的写法
<template>
<div>
<slot name="toggleBtn"></slot>
<div class="siderbar-container" v-html="content">
</div>
</div>
</template>
父组件中的写法
<sidebar class="left">
<button
class="btn btn-default toggle-btn"
slot="toggleBtn"
@click="toggle">{{ toggleText }}</button>
</sidebar>
然后是动画效果的设置
首先布局方面使用的圣杯布局，一开始是展开状态，设置isToggle:false,toggleText: '收起'然后需要设置点击的时候，执行一个方法，将宽度缩小至5%，padding-left设置为20%，同时将isToggle和toggleText都分别换成TRUE和‘展开 ’
记住，只要属性改变，可以使用transition属性设置动画效果
