编译把模板编译成 render 函数的过程称作编译。 生成render函数在$mount方法里 进入compileToFunctions 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949 ...

响应式数据变化的时候触发DOM的变化，数据变化对DOM的处理有几个问题： 修改哪块的 DOM？ 效率和性能是不是最优的？ 是每次数据变化都去修改DOM吗 响应式对象Object.defineProperty(obj, prop, descriptor)方法) 响应式对象核心就是使用这个方法为对象属性添加getter与setter Vue会把props、data等变成响应式对象，在创建过程中，发现子属性也是对象，就递归把对象变成响应式 模板代码： main.js 12345678910 ...

组件每个组件依赖的 CSS、JavaScript、模板、图片等资源放在一起开发和维护。页面可以有多个组件拼接起来。 模板 main.js 1234567891011121314151617181920import Vue from 'vue'import App from './App'Vue.config.productionTip = false/* eslint-disable no-new */new Vue({ el: '#app', data: function () ...

什么是数据驱动视图由数据驱动生成，意思就是只对数据修改，而不是直接操作DOM。 new Vue发生了什么如何调试 可以通过vue-cli新建一个项目，这里没有选择装最新的`vue-cli@3.0，而是安装了vue-cli@2.9.6` 12$ npm install -g vue-cli@2.9.6$ vue create my-vue-app 看一下项目根目录的package.json文件的scripts 123"scripts": { "dev": "webpack-dev-se ...

FlowFlow是JavaScript静态检查工具。 在编译阶段就发现错误，而不是运行时才发现。 源码目录结构Vue.js 的源码都在 src 目录下，其目录结构如下。 12345678910111213src├── compiler # 编译相关 ├── core # 核心代码 ├── platforms # 不同平台的支持├── server # 服务端渲染├── sfc # .vue 文件解析├── ...

History api1234567方法：back() forward()go()属性：length 12345678910//返回window.history.back()window.history.go(-1)//向前跳转window.history.forward()window.history.go(1)//历史记录中页面总数history.length HTML5 新方法：添加和替换历史记录的条目 pushState 1history.pushState(state, title, ...

API文档 实例属性 实例属性 类型 描述 $data Object Vue 实例代理了对其 data 对象属性的访问 $el Element Vue 实例使用的根 DOM 元素。 $parent Vue instance 父实例，如果当前实例有的话。 $root Vue instance 当前组件树的根 Vue 实例。如果当前实例没有父实例，此实例将会是其自己。 $children Array 当前实例的直接子组件。需要注意 $children 并不保证顺序，也不是 ...

操作元素的 class 列表和内联样式是数据绑定的一个常见需求。因为它们都是属性，所以我们可以用 v-bind 处理它们：只需要通过表达式计算出字符串结果即可。不过，字符串拼接麻烦且易错。因此，在将 v-bind 用于 class 和 style 时，Vue.js 做了专门的增强。表达式结果的类型除了字符串之外，还可以是对象或数组。 Class对象语法 1<div class="static" v-bind:class="{ active: isActive, 'text-dan ...

过滤器Vue.js 允许你自定义过滤器，可被用于一些常见的文本格式化。过滤器可以用在两个地方：双花括号插值和 v-bind 表达式 (后者从 2.1.0+ 开始支持)。过滤器应该被添加在 JavaScript 表达式的尾部，由“管道”符号指示 12345<!-- 在双花括号中 -->{{ message | capitalize }}<!-- 在 `v-bind` 中 --><div v-bind:id="rawId | fo ...