笔记一下：

vue.js 安装，参考：

http://www.cnblogs.com/wisewrong/p/6255817.html （vue-cli）

http://www.cnblogs.com/zhuzhenwei918/p/6870340.html?utm_source=itdadao&utm_medium=referral (less install)

https://www.zhihu.com/question/38213423 (moke、目录结构等)

https://molunerfinn.com/Vue+Koa/ （全栈开发实战：用Vue2+Koa1开发完整的前后端项目（更新Koa2））

生命周期钩子函数：

computed 计算属性,计算属性是基于它们的依赖进行缓存的，常可同时监听多个后的计算methods  则没有缓存  watch    可每个单独监听变动

条件渲染

v-if     被销毁和重建 只有为真，才渲染，常用于 不频繁切换
v-show   只是 display 的切换，开始就全加载

缩写：

v-bind 缩写
<!-- 完整语法 -->
<a v-bind:href="url">...</a>
<!-- 缩写 -->
<a :href="url">...</a>

v-on 缩写
<!-- 完整语法 -->
<a v-on:click="doSomething">...</a>
<!-- 缩写 -->
<a @click="doSomething">...</a>

练习：

使用 v-html 指令用于输出 html 代码

<div v-html="message"></div>

HTML 属性中的值应使用 v-bind 指令

<div v-bind:class="{'class1': class1}">

Vue.js 都提供了完全的 JavaScript 表达式支持。

<div id="app">
    {{5+5}}<br>
    {{ ok ? 'YES' : 'NO' }}<br>
    {{ message.split('').reverse().join('') }}
    <div v-bind:id="'list-' + id">测试一下</div>
</div>

指令是带有 v- 前缀的特殊属性。

<p v-if="seen">现在你看到我了</p>

参数在指令后以冒号指明。例如， v-bind 指令被用来响应地更新 HTML 属性

官方中文：

https://cn.vuejs.org/v2/guide/

// 点击阻止冒泡

常见问题收集：

1 . 解决 FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory 问题

2. props 使用 https://www.cnblogs.com/xiaohuochai/p/7388866.html

来源：https://www.cnblogs.com/xiangsj/p/6906976.html

标签

vue-cli

vue.js初始学习笔记&vue-cli

1 . 解决 FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory 问题