跳过正文
  1. 文章/
  2. 前端/
  3. Vue/

2、API

·1145 字·3 分钟· loading · loading · ·
前端 Vue
GradyYoung
作者
GradyYoung
Vue - 点击查看当前系列文章
§ 2、API 「 当前文章 」

全局配置
#

Vue.config 是一个对象,包含 Vue 的全局配置。

silent
#

取消 Vue 所有的日志与警告

  • 类型boolean
  • 默认值false
Vue.config.silent = true

optionMergeStrategies
#

自定义合并策略的选项,合并策略选项分别接收在父实例和子实例上定义的该选项的值作为第一个和第二个参数,Vue 实例上下文被作为第三个参数传入

  • 类型{ [key: string]: Function }
  • 默认值{}
Vue.config.optionMergeStrategies._my_option = function (parent, child, vm) {
    return child + 1
}

const Profile = Vue.extend({
    _my_option: 1
})
// Profile.options._my_option = 2

devtools
#

配置是否允许 vue-devtools 检查代码。

  • 类型boolean
  • 默认值true (生产版为 false)
// 务必在加载 Vue 之后,立即同步设置以下内容
Vue.config.devtools = true

errorHandler
#

指定组件的渲染和观察期间未捕获错误的处理函数。这个处理函数被调用时,可获取错误信息和 Vue 实例

  • 类型Function
  • 默认值undefined
Vue.config.errorHandler = function (err, vm, info) {
    // handle error
    // `info` 是 Vue 特定的错误信息,比如错误所在的生命周期钩子
    // 只在 2.2.0+ 可用
}

warnHandler
#

2.4.0 新增,为 Vue 的运行时警告赋予一个自定义处理函数。注意这只会在开发者环境下生效,在生产环境下它会被忽略

  • 类型Function
  • 默认值undefined
Vue.config.warnHandler = function (msg, vm, trace) {
    // `trace` 是组件的继承关系追踪
}

ignoredElements
#

须使 Vue 忽略在 Vue 之外的自定义元素 (e.g. 使用了 Web Components APIs)。否则,它会假设你忘记注册全局组件或者拼错了组件名称,从而抛出一个关于 Unknown custom element 的警告。

  • 类型Array<string | RegExp>
  • 默认值[]
Vue.config.ignoredElements = [
    'my-custom-web-component',
    'another-web-component',
    // 用一个 `RegExp` 忽略所有“ion-”开头的元素
    // 仅在 2.5+ 支持
    /^ion-/
]

keyCodes
#

v-on 自定义键位别名

  • 类型{ [key: string]: number | Array<number> }
  • 默认值{}
Vue.config.keyCodes = {
    v: 86,
    f1: 112,
    // camelCase 不可用
    mediaPlayPause: 179,
    // 取而代之的是 kebab-case 且用双引号括起来
    "media-play-pause": 179,
    up: [38, 87]
}

performance
#

2.2.0 新增,设置为 true 以在浏览器开发工具的性能/时间线面板中启用对组件初始化、编译、渲染和打补丁的性能追踪。只适用于开发模式和支持 performance.mark API 的浏览器上

  • 类型boolean
  • 默认值false (自 2.2.3 起)

productionTip
#

2.2.0 新增,设置为 false 以阻止 vue 在启动时生成生产提示

  • 类型boolean
  • 默认值true

全局API
#

Vue.set
#

Vue.set( target, propertyName/index, value )

  • 参数
    • {Object | Array} target
    • {string | number} propertyName/index
    • {any} value
  • 返回值:设置的值。
  • 用法:向响应式对象中添加一个 property,并确保这个新 property 同样是响应式的,且触发视图更新。它必须用于向响应式对象上添加新 property,因为 Vue 无法探测普通的新增 property (比如 this.myObject.newProperty = 'hi')
  • 注意:对象不能是 Vue 实例,或者 Vue 实例的根数据对象。

Vue.extend
#

Vue.extend( options )

  • 参数

    • {Object} options
  • 用法

    使用基础 Vue 构造器,创建一个子类。参数是一个包含组件选项的对象。

    data 选项是特例,需要注意 - 在 Vue.extend() 中它必须是函数

// 创建构造器
var Profile = Vue.extend({
    template: '<p>{{firstName}} {{lastName}} aka {{alias}}</p>',
    data: function () {
        return {
            firstName: 'Walter',
            lastName: 'White',
            alias: 'Heisenberg'
        }
    },
    //datak
    //data(){ 
	//}
})
// 创建 Profile 实例,并挂载到一个元素上。
new Profile().$mount('#mount-point')

Vue.component
#

Vue.component( id, [definition] )

  • 参数

    • {string} id
    • {Function | Object} [definition]
  • 用法

    注册或获取全局组件。注册还会自动使用给定的 id 设置组件的名称。

// 注册组件,传入一个扩展过的构造器
Vue.component('my-component', Vue.extend({ /* ... */ }))

// 注册组件,传入一个选项对象 (自动调用 Vue.extend)
Vue.component('my-component', { /* ... */ })

// 获取注册的组件 (始终返回构造器)
var MyComponent = Vue.component('my-component')
Vue - 点击查看当前系列文章
§ 2、API 「 当前文章 」