2017.11.16号

有时候也需要在内联语句处理器中访问原始的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进行前端代码基准测试

验证

Vue中数组变异方法部分的源码

JavaScript的内存管理

使用git status查看状态
使用git add 将上面status中打印出来的路径放在后面即可

Less的学习

---

---

---

今天主要的学习成果有：

• 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属性设置动画效果