Sukla的博客

1、使用的tomcat部署2、将打包后的目录 dist 放到tomcat的webapp目录里面3、在dist中添加WEB-INFO目录 做重定向 当404的时候 将dist中的 index.html页面作为错误页面返回4、nginx代理 将 “IP:端口/dist” 代理成 “IP:端口”5、访问 “IP：端口/” 就能访问部署后的vue的history路由模式的项目了6、其...

1，每个虚拟DOM VNode 都是唯一的 可以多次使用工厂函数创建多个组件的实例2，在渲染函数中 有些语法可以使用 javascript 不用 再使用 vue 的 API 3，在渲染函数中 使用 if else 而不是 v-if4，在渲染函数中 使用 map  而不是 v-for5，在渲染函数中 重写 v-model6，提供了在渲染函数中 被 on 的时候 事件和按键的修饰符

1，过滤器 一般用来对文本进行格式化 主要用在 {{}} 插值 和 v-bind: 接受参数的时候使用 2，过滤器 使用 管道符 | 分隔 将过滤器前面的 操作链 的 结果 作为 第一个参数传入 3，多个过滤器 可以串联 每个过滤器 把前面的操作链的结果 作为参数 计算之后 将结果传给 后面的过滤器进行计算 4，过滤器 也是 javascript 函数 可以接收多个参数 但是 过滤器

1，vue 是 mvvm 框架 没有 mvc 里面的控制层 只是在v 视图修改的时候 通过 vm 实例 修改了 m 数据层 数据层 修改后  vm 实例重新根据 数据 计算需要显示的内容到视图层显示2，Object.defineProperty(obj,属性名字,{get:function(){},set:function(){}})可以给某一个对象的添加属性 同时设置属性值变

1，已经在服务中添加了MongoDB 点击启动ctrl+r cmd 在控制台查看 已经启动了2，设置跨域 使用axios 的时候并不能跨域 要使用 target 插件 找到 vue 项目 config/index.js 文件  找到dev 修改 proxyTable设置dev:{...proxyTable:{'接口名字':{//当这个接口在前台被调用的时候

1，cnpm i vue --save 安装开发依赖 i 是 install 的简写2，vue-cli -g 全局安装脚手架3，vue init webpack MyDemoName 在回车输入一些列描述选项 项目名称不能包含大写字母 在 MyDemoName 文件夹下面会构造一个基本的模板文件4，cd MyDemoName 进入文件 npm install 安装依赖 npm run

1，npm install vue-resource --save 安装插件 插件是上线后也要用的2，一般都在 node_modules/vue-resource/dist/vue-resource.js 路径3，构建一个 vue 实例 然后 使用 v-on:click="get"  v-on:click="post" 触发请求4，get 请求 一般传两个参数 this.$http.g

1，npm install axios --save 安装 axios 2，通过 node_modules/axios/dist/axios.js 引用3，常用 get post http 4，拦截器 在发请求的前后 进行一些校验5，vue-resource 的拦截器 mounted:function(){Vue.http.interceptors.push(functio

1，箭头函数 只有一条语句的时候 不用加花括号 function(a){return a+b} 相当于 a=>a+b有多个参数的时候 要加上圆括号(a,b)=>a+b有多条语句的时候 要加上花括号(a,b)=>{a=c;return a+b}2，... 的用法 3，...和参数放到一起的时候 表示将未知个数的参数 放到数组 m 中f(...m){

1，首先将原本的html页面按照模块来布局 方便划分 然后将多个页面的公共的模块抽离出来 作为一个组件 然后在页面需要的时候 插入这个组件就行 一般能把 头部 尾部 面包屑抽取出来2，不同页面的面包屑的 主要的结构都是一样的 但是不同的页面会显示不同的内容 可以使用 slot 插槽来 注入该页面的内容 3，引入css 文件的时候 直接引入即可 import './css/path'4，

1，node 是基于 chrome v8 引擎的 javascript 运行环境2，可以直接使用 es6 语法 在node 里面的语法 不要和浏览器混淆 node 就是后端语言 能够提供服务 提供接口 3，在node 中使用 common.js 的组件化概念 通过 module.exports={k:v}  exports.k=v 来导出数据4，通过  var obj=require

1，通过 mongoose 插件来访问 mongoDB 数据库 通过 mongoose 的 model 实体调用 mongoose 插件的 api2，model.find(params).skip(skip).limit(pageSize).sort({‘keyname’:sort}); Object params 是一个 对象 是查询条件 int skip 是表示忽略掉多少条in

1，插件功能 是一个消息弹窗 效果如图 2，创建package自己新建一个目录 view-toast-m-m在 view-toast-m-m 目录下执行 npm init会在目录下生成 package.json 文件3，编写插件新建目录 view-toast-m-m /src/lib view-toast-m-m /src/lib 目录下创建 vue-toa

1，多数的代码复用通过组件来实现 组件创建 HTML 的时候 还是需要 javascript 的完全编程能力的 2，render 函数 更像是一个编译产出 HTML 的编译器 template 不太像编译器3，组件中 当不使用插槽 slot 的时候 子元素是放在 组件实例的 $slot.default 中4，浏览器在读到 HTML 代码的时候 为了保持对代码的追踪 会根据 HTML 的

1，递归组件 组件模板上要设置 name属性 才可以成为递归组件 递归组件容易进入无限循环 要确保有终止条件2，组件之间循环引用 在tree 型目录结构中比较常见 A组件需要B组件 B组件也需要A组件 如果是Vue 注册的全局组件的话就没有问题 但是如果用打包工具的话 会进入无限循环 这个时候要设置引发冲突的组件不用提前加载 而是在生命周期的brfoerCreate 钩子里面加载3，内联模

1，还没有开始学习node npm webpack vue-cli等工具2，使用传统的写页面的方法引入的vue3，创建vue对象 var app=new({el:'#id',data:{name:'sukla',age:2017,some:'',value:'',istrue:true,isActive:truetodos:[{text:"suk

1，vue 中有保留的过渡模板 当在这个模板中间的元素发生过渡的时候 会在过渡的各个时期 加上特定的class 或者移除特定的 class2，vue 中有保留的动画模板 用法和过渡模板组件一个意思3，可以自定义各个钩子中要操作的 class 的名字 用来和动画库 过渡库 配合使用

1，在同时有过渡和动画的时候 不知道那个会先结束 需要设置要监听的了类型2，一般VUE能够自己计算过渡或者动画的完成时机 也可以由提前设置时机3，可以在属性中声明 钩子  v-on:before-enter="beforeEnter" 进入中  v-on:enter enter(el,done) 此回掉函数是可选项的设置 与css 结合使用v-on:after-enterv

1，v-model 是一个语法糖 会根据使用v-model的元素的不同 绑定相应的数据2，单个勾选框 对应的是单个值data:{value:"123"}v-model 会把这个勾选框被勾选时候的值返回到 data 中更新 data 中的 value3，多个勾选框 对应的是一个数组data:{values:["123","456"]}

1，新旧两个元素参与过渡或者动画的时候 新元素的进入和旧元素的离开是同时进行的 可以使用in-out 和 out-in 来设置过渡模式 指定其中的一个元素先执行过渡 执行完之后才执行另一个元素的过渡2，多个组件的过渡 使用动态组件3，transition-group 列表过度 这个元素是一个真实的元素 默认是一个 span 元素 可以通过 tag 来变更默认元素 可以通过name 来设置钩

1，队列的交错过渡 通过 data 属性 和javascript 通信 可以实现2，可复用过渡，通过组件系统实现 ，将 transition-group 作为组件的根元素即可 配合函数组件更适合3，动态过渡 通过绑定 name 动态地获取过渡的数据 根据钩子获取上下文 根据组件状态通过javascript 设置不同的过渡效果 组件通过传入的 props 参数来修改过渡参数

1，有一些特性不用在props里边写上 可以直接在组件上写 会绑定到根元素上2，如果模板在定义的时候已经写上了默认的属性 比如type="xxx"那么在组件被使用之后 如果在组件上再写一个同名的属性 一般会把旧的替换掉 然而 class 和 style 属性不会被替换 而是把所有的 class 或者 style 的内容合并成一个 class 或者 style3，自定义事件 子组件通过事

1，数字元素的原始数据可以被实例存储起来 可以直接转换成数字 再通过响应式和组件系统 将数据和第三方库来切换元素的过渡状态2，状态动画与观察者 观察者可以监听数值的更新 数值更新的时候触发动画3，对于color 可以转换成 rgb 的值 再通过数值过渡4，动态状态过渡  在数据背后实时更新状态5，把过渡放到组件里面 和实例分离 减少复杂性

1，编译作用域 在父容器中插入子容器 父容器是不能识别子容器自己的属性的 父容器只能识别自己作用域的属性 子容器只能识别自己作用域的属性子容器如果相定义自己根元素上面的属性 应该在自己的作用域范围内部定义2，单个插槽 如果子容器中没有一个slot 元素的话 父容器的原有内容就会被丢弃 如果有一个的话 那么如果父容器有内容的话 父容器的原有内容会占据slot 的DOM位置 并将slot 元素

1，使用混合的时候 会把混合里面的和实例里面的一般类型的同名的属性合并为一个数组 然挨个调用 先调用的是混合里面的属性2，如果是对象类型的属性的话 如果重名的话 就保留实例里面的 3，可以自定义混合的合并策略 默认是一般类型的重名属性合并成数组调用 对象类型 重名保留组件对象 弃用混合的对象 vuex有更高级的策略

1，具名插槽，插槽可以有名字name，在父容器的元素中可以指定元素的slot属性为子组件模板中的slot的name属性的值 通过这种方法可以为父容器的元素指定插槽2，子组件中插槽可以不设置name 属性 这样的话 这个插槽就是一个默认插槽 当父容器中有元素没有设置具名插槽的时候 这一部分元素就会放到默认插槽里面 如果没有默认插槽的话 这一部分元素就会被舍弃3，作用域插槽 是一个特殊类型的插

1，在vue 中大多数的代码复用抽象是通过组件实现的 但是避免不了操纵 DOM 可以给DOM 使用自定义指令2，自定义指令函数 提供了一些钩子 bind 钩子 仅在指令第一次绑定到元素上的时候调用一次 执行一些操作3，自定义指令 inserted 钩子 插入父节点时候调用4，自定义指令 update 钩子 组件的 vnode 更新的时候 或者其孩子的 vnode 更新的时候 调用5

1，vue是基于DOM的，每一个vue实例都可以解析成一个dom对象；2，vue是api简洁的；3，{{}}

1，条件渲染 有 v-show v-if v-else-if v-else2，v-if="isActive" 放到元素上 当data中的 isActive 的boolan值是true的时候 会把v-if所在的那个元素渲染出来 如果为false的话 就不会渲染当前元素 而是渲染紧跟在这个元素后面的有v-else 的元素 或者有v-else-if的元素 3，v-else必须跟在v-if后面 i