Vue入门

Vue2.0官方文档英文版
Vue2.0官方文档中文版

Vue2.0API英文版
Vue2.0API中文版

VUE系列教程目录

Vue.js学习系列

Vue Router中文官网

Vue 2.0 起步(1) 脚手架工具 vue-cli + Webstorm 2016 + webpack

WebStorm添加vue插件高亮显示*.vue文件

Vue.use(Router)

如果在一个模块化工程中使用它，必须要通过 Vue.use() 明确地安装路由功能：例如index.js中

import Router from 'vue-router'

Vue.use(Router)
...

使用全局的 script 标签，则无须如此（手动安装），例如index.html中

...
var router = new VueRouter({
    routes:[
        { path: '/foo', component: {template:'
foo
'} }
        ,{ path: '/bar', component: {template:'
bar
'} }
    ] 
})
...

Es6中export default 和 export 区别

单文件组件与全局组件的区别

全局组件

1. 定义

Vue.component('my-component-name', { /* ... */ })

2. 使用

new Vue({ el: '#container '})

单文件组件

1. 在*.vue中定义

2. 在index.html中使用，或者通过vue-router来使用

Mint UI中的样式：PostCSS深入学习: 结合BEM和SUIT方法使用PostCSS

vue_cli构建的项目如何去除脏边距

在App.vue中的样式添加以下代码：

CSS优先级

Vue中如何自定义提供给外部修改数据的组件

例如自定义ToolBar标题栏，组件的标题是需要使用该组件的地方去自定义的：

第一种方法：使用prop类型传值

1. 定义组件ToolBar.vue

2. 使用组件

使用slot插槽，深入理解vue中的slot与slot-scope

1. 定义组件ToolBar.vue

...

2. 使用组件

根据状态动态切换CSS样式

通过class对象绑定切换样式

css实现遮罩效果以及帧布局使用

自定义组件绑定事件不起作用

// @click='handleClick’ 不起作用
@click.native='handleClick’

在组件上绑定事件，你不加 .native修饰符 告诉它是这是原生点击事件，它会以为这是你定义的自定义事件。

Vue常用事件

[Vue中如何在父组件中获取自定义的CheckBox的选中状态]

1. 自定义CheckBox通过v-model观察CheckBox的选中状态变化，然后通过监听器观察checked值得变化，在方法内部通过emit自定义事件，触发onCheckChange自定义事件

2. 在使用CheckBox的父组件中绑定onCheckChange事件

Vue2.0组件之间的通信

html 去掉input 获取焦点时的边框

Vue2.0 如何传递 数值或boolean

Vue中怎么才能使用data中的数据做为变量的值?

必须使用计算属性

input标签限制输入长度

oninput="if(value.length>11)value=value.slice(0,11)"