Vue开发基础下
Vue开发基础下
- 全局API
- 实例属性
- 全局配置
- 组件进阶
全局API
| 全局API | 说明 | 例子 |
|---|---|---|
| Vue.directive | 自定义类似v-model的指令 | v-focus="true" |
| Vue.use | 注册使用插件 | Vue.use(Vuelidate) |
| Vue.extend | 基于Vue扩展生成一个子类，子类包含Vue的所有内容和自定义新内容 | var Vue2=Vue.extend({}) |
| Vue.set | 动态添加响应式属性，不能是根级属性，根级属性只能预先声明 | Vue.set(vm.obj,'b','我是响应式属性') |
| Vue.mixin | 插件作者使用，向组件中自定义注入方法，影响所有Vue实例 | Vue.mixin({created(){}}) |
ps：响应式指会动态更新页面，data就是响应式根级属性。
实例属性
| 属性 | 说明 | 例子 |
|---|---|---|
| vm.$props | 在子组件中调用props传递的参数 | vm.$props.name |
| vm.$options | 获取自定义数据（Vue实例中定义的k-v）(非响应式) | vm.$options.xxx |
| vm.$el | 访问Vue实例嵌入的根DOM元素 | vm.$el.innerHTML |
| vm.$chilren | 获取子组件 | this.$children |
| vm.$root | 组件数任意调用获取的都是根Vue实例 | this.$root===vm.$root |
| vm.$slots | Vue实例包裹的内容默认不显示在页面，需要用插槽显示 | |
| vm.$attrs | 获取不包含class，style以及被声明过的props属性 | this.$attrs |
ps：根实例vm在结构，内容上其实就是最顶层的父组件，可想象成一根父子组件树。
以下博文是有关于vm.$attrs的详细使用说明，旨在解决跨级传参冗杂的问题
https://www.jianshu.com/p/ce8ca875c337
全局配置
-
productionTip ----生产模式信息隐藏
- Vue.config.productionTip = false
-
silent ----取消Vue日志和警告（Vue warn）
- Vue.config.silent = true
-
devtools ----不允许调试，Vue面板消失
- Vue.config.devtools = false
组件进阶
- mixins
- render
- createElement
mixins:
将一个对象包含其所有属性选项（可包含任何组件选项）移植混入组件中，在相同数据属性冲突时，优先组件自身的选项属性，mixins混入的对象钩子函数将在组件自身钩子函数后执行。（对应属性交替同步执行）
[HMR] Waiting for update signal from WDS...
beforeCreate in mixin
beforeCreate in defalut
created in mixin
created in default
render与createElement:
常常联合一起使用用于操作新实例dom属性细节，方式自由但比较少用，一般还是用template。比较复杂，建议看官方文档。
