Home / Class/ options Class — vue Architecture

options Class — vue Architecture

Architecture documentation for the options class in component.ts from the vue codebase.

Entity Profile

Dependency Diagram

graph TD
  0edc1b6a_85da_9368_ef12_f7a9fe7610e4["options"]
  ba29f985_44b7_4ac5_07cd_a4e17537349a["component.ts"]
  0edc1b6a_85da_9368_ef12_f7a9fe7610e4 -->|defined in| ba29f985_44b7_4ac5_07cd_a4e17537349a
  4591a59e_bd81_b28e_ad71_91fba8f488a9["constructor()"]
  0edc1b6a_85da_9368_ef12_f7a9fe7610e4 -->|method| 4591a59e_bd81_b28e_ad71_91fba8f488a9

Relationship Graph

Source Code

src/types/component.ts lines 14–212

export declare class Component {
  constructor(options?: any)
  // constructor information
  static cid: number
  static options: Record<string, any>
  // extend
  static extend: GlobalAPI['extend']
  static superOptions: Record<string, any>
  static extendOptions: Record<string, any>
  static sealedOptions: Record<string, any>
  static super: typeof Component
  // assets
  static directive: GlobalAPI['directive']
  static component: GlobalAPI['component']
  static filter: GlobalAPI['filter']
  // functional context constructor
  static FunctionalRenderContext: Function
  static mixin: GlobalAPI['mixin']
  static use: GlobalAPI['use']

  // public properties
  $el: any // so that we can attach __vue__ to it
  $data: Record<string, any>
  $props: Record<string, any>
  $options: ComponentOptions
  $parent: Component | undefined
  $root: Component
  $children: Array<Component>
  $refs: {
    [key: string]: Component | Element | Array<Component | Element> | undefined
  }
  $slots: { [key: string]: Array<VNode> }
  $scopedSlots: { [key: string]: () => VNode[] | undefined }
  $vnode: VNode // the placeholder node for the component in parent's render tree
  $attrs: { [key: string]: string }
  $listeners: Record<string, Function | Array<Function>>
  $isServer: boolean

  // public methods
  $mount: (
    el?: Element | string,
    hydrating?: boolean
  ) => Component & { [key: string]: any }
  $forceUpdate: () => void
  $destroy: () => void
  $set: <T>(
    target: Record<string, any> | Array<T>,
    key: string | number,
    val: T
  ) => T
  $delete: <T>(
    target: Record<string, any> | Array<T>,
    key: string | number
  ) => void
  $watch: (
    expOrFn: string | (() => any),
    cb: Function,
    options?: Record<string, any>
  ) => Function
  $on: (event: string | Array<string>, fn: Function) => Component
  $once: (event: string, fn: Function) => Component
  $off: (event?: string | Array<string>, fn?: Function) => Component
  $emit: (event: string, ...args: Array<any>) => Component
  $nextTick: (fn: (...args: any[]) => any) => void | Promise<any>
  $createElement: (
    tag?: string | Component,
    data?: Record<string, any>,
    children?: VNodeChildren
  ) => VNode

  // private properties
  _uid: number | string
  _name: string // this only exists in dev mode
  _isVue: true
  __v_skip: true
  _self: Component
  _renderProxy: Component
  _renderContext?: Component
  _watcher: Watcher | null
  _scope: EffectScope
  _computedWatchers: { [key: string]: Watcher }

Domain

Frequently Asked Questions

What is the options class?
options is a class in the vue codebase, defined in src/types/component.ts.
Where is options defined?
options is defined in src/types/component.ts at line 14.

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free