05 2017 档案
webpack
摘要:一. 安装 我们常规直接使用 npm 的形式来安装: $ npm install webpack -g 当然如果常规项目还是把依赖写入 package.json 包去更人性化: $ npm init$ npm install webpack --save-dev 阅读全文
posted @ 2017-05-24 14:53 半夏微澜ぺ 阅读(99) 评论(0) 推荐(0) 编辑
使用x-template 定义模板
摘要:demo 使用x-template定义模板,设置id 在vue的实例中使用 new Vue({ el:"#app", components:{ 'script-component-demo':{ template:'#myFirstScriptComponent' } } } }); html 阅读全文
posted @ 2017-05-24 10:55 半夏微澜ぺ 阅读(776) 评论(0) 推荐(0) 编辑
vue 过渡效果
摘要:Vue 提供了 transition 的封装组件,在下列情形中,可以给任何元素和组件添加 entering/leaving 过渡 条件渲染 (使用 v-if) 条件展示 (使用 v-show) 动态组件 组件根节点 这里是一个典型的例子: new Vue({ el: '#demo', data: { 阅读全文
posted @ 2017-05-24 10:32 半夏微澜ぺ 阅读(200) 评论(0) 推荐(0) 编辑
可复用的组件
摘要:在编写组件时,可复用的组件应当定义一个清晰的公开接口。 Vue组件的API来自三部分, props events slots Props 允许外部环境传递数据给组件 Events 允许组件触发外部环境的副作用 Slots 允许外部环境将额外的内容组合在组件中。 Props 允许外部环境传递数据给组件 阅读全文
posted @ 2017-05-24 10:30 半夏微澜ぺ 阅读(264) 评论(0) 推荐(0) 编辑
vue 子组件 索引 ref
摘要:尽管有props和events,但是有时任然需要在javascript中直接访问子组件。为此可是使用ref为子组件指定一个索引ID. $refs 只在组件渲染完成之后才填充,并且它是非响应式的。它仅仅作为一个直接访问子组件的应急方案 应当避免在模板或者计算属性中使用$refs 阅读全文
posted @ 2017-05-23 19:30 半夏微澜ぺ 阅读(1364) 评论(0) 推荐(0) 编辑
vue 练习 bug
摘要:在使用vue slot分发内容时,如果要绑定事件,不能绑定在slot元素上,同样的不能绑定在自定义元素的模板上,只能绑定在html 元素上,才会生效 demo <my-component v-on:click="functiona()"></my-component>//错误 Vue.compone 阅读全文
posted @ 2017-05-23 19:17 半夏微澜ぺ 阅读(121) 评论(0) 推荐(0) 编辑
使用slot分发内容 作用域插槽
摘要:除非子组件模板包含至少一个<slot>插口,否则父组件的内容将会别丢弃。当子组件模板只有一个没有属性的slot时,父组件整个内容片断将插入到slot所在的DOM位置,并替换掉slot标签本身。 最初在 <slot> 标签中的任何内容都被视为备用内容。备用内容在子组件的作用域内编译,并且只有在宿主元素 阅读全文
posted @ 2017-05-23 18:07 半夏微澜ぺ 阅读(1926) 评论(0) 推荐(0) 编辑
vue 组件 全局注册和局部注册
摘要:全局注册,注册的组件需要在初始化根实例之前注册了组件; 局部注册,通过使用组件实例选项注册,可以使组件仅在另一个组件或者实例的作用域中可用: 全局组件 js 局部组件demo: html js 组件实例的作用域是孤立的。这意味着不能再子组件的模板内直接引用父组件的数据。要让子组件可以使用父组件的数据 阅读全文
posted @ 2017-05-23 17:09 半夏微澜ぺ 阅读(11781) 评论(1) 推荐(0) 编辑
vue demo todo-list
摘要:html js 阅读全文
posted @ 2017-05-23 10:21 半夏微澜ぺ 阅读(199) 评论(0) 推荐(0) 编辑
vue tab切换demo
摘要:定义tab页面切换的内容 定义组件 使用 阅读全文
posted @ 2017-05-23 10:03 半夏微澜ぺ 阅读(5543) 评论(1) 推荐(2) 编辑
计算属性computed 与methods
摘要:你可能已经注意到我们可以通过调用表达式中的 method 来达到同样的效果: 我们可以将同一函数定义为一个 method 而不是一个计算属性。对于最终的结果,两种方式确实是相同的。然而,不同的是计算属性是基于它们的依赖进行缓存的。计算属性只有在它的相关依赖发生改变时才会重新求值。 这就意味着只要me 阅读全文
posted @ 2017-05-23 09:43 半夏微澜ぺ 阅读(322) 评论(0) 推荐(0) 编辑
vue 生命周期钩子 过滤器 计算属性
摘要:每一个Vue实例在被创建之前都要经过一系列的初始化过程。例如,实例需要配置数据观测、编译模板、挂载实例到DOM,然后在数据变化时更新DOM,在这个过程中,实例也会调用一些生命周期钩子,这就给我们提供了执行自定义逻辑的机会。例如:created 这个钩子在实例被创建之后被调用: 过滤器 vue允许你自 阅读全文
posted @ 2017-05-22 16:01 半夏微澜ぺ 阅读(875) 评论(0) 推荐(0) 编辑
vue 随笔 vue 的属性和方法
摘要:新建的项目中main.js是项目的入口文件 npm run dev 运行文件 npm run bulid 编译 属性与方法 每个Vue实例都会代理其 data 对象里所有的属性: tipping: 只有这些被代理的属性是响应的,如果在实例创建之后添加新的属性到实例上,它不会触发视图更新。 除了dat 阅读全文
posted @ 2017-05-22 15:13 半夏微澜ぺ 阅读(211) 评论(0) 推荐(0) 编辑