Home / File/ reactive.ts — vue Source File

reactive.ts — vue Source File

Architecture documentation for reactive.ts, a typescript file in the vue codebase. 3 imports, 5 dependents.

File typescript VueCore Instance 3 imports 5 dependents 10 functions 1 classes

Entity Profile

Dependency Diagram

graph LR
  e84ea476_9f30_e7b9_aaa0_4026f0c97365["reactive.ts"]
  22b44e72_ad0a_6a98_e36a_e325291fd02b["ref.ts"]
  e84ea476_9f30_e7b9_aaa0_4026f0c97365 --> 22b44e72_ad0a_6a98_e36a_e325291fd02b
  eb7174f6_f021_7b84_3862_bd9a0db1b30a["observer"]
  e84ea476_9f30_e7b9_aaa0_4026f0c97365 --> eb7174f6_f021_7b84_3862_bd9a0db1b30a
  6d8f8976_7066_720b_0d45_45fe42921eaf["util"]
  e84ea476_9f30_e7b9_aaa0_4026f0c97365 --> 6d8f8976_7066_720b_0d45_45fe42921eaf
  3a7c7919_1905_22a7_f604_9084d5e5d0df["apiSetup.ts"]
  3a7c7919_1905_22a7_f604_9084d5e5d0df --> e84ea476_9f30_e7b9_aaa0_4026f0c97365
  e5380f01_49bc_d965_1141_151fb5c6c097["apiWatch.ts"]
  e5380f01_49bc_d965_1141_151fb5c6c097 --> e84ea476_9f30_e7b9_aaa0_4026f0c97365
  49a97e06_4034_4e1d_a0e8_bb7368ceb3af["computed.ts"]
  49a97e06_4034_4e1d_a0e8_bb7368ceb3af --> e84ea476_9f30_e7b9_aaa0_4026f0c97365
  8420591a_8fdc_59a9_134d_e2c52487724c["readonly.ts"]
  8420591a_8fdc_59a9_134d_e2c52487724c --> e84ea476_9f30_e7b9_aaa0_4026f0c97365
  22b44e72_ad0a_6a98_e36a_e325291fd02b["ref.ts"]
  22b44e72_ad0a_6a98_e36a_e325291fd02b --> e84ea476_9f30_e7b9_aaa0_4026f0c97365
  style e84ea476_9f30_e7b9_aaa0_4026f0c97365 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import { observe, Observer } from 'core/observer'
import {
  def,
  isArray,
  isPrimitive,
  warn,
  toRawType,
  isServerRendering
} from 'core/util'
import type { Ref, UnwrapRefSimple, RawSymbol } from './ref'

export const enum ReactiveFlags {
  SKIP = '__v_skip',
  IS_READONLY = '__v_isReadonly',
  IS_SHALLOW = '__v_isShallow',
  RAW = '__v_raw'
}

export interface Target {
  __ob__?: Observer
  [ReactiveFlags.SKIP]?: boolean
  [ReactiveFlags.IS_READONLY]?: boolean
  [ReactiveFlags.IS_SHALLOW]?: boolean
  [ReactiveFlags.RAW]?: any
}

// only unwrap nested ref
export type UnwrapNestedRefs<T> = T extends Ref ? T : UnwrapRefSimple<T>

export function reactive<T extends object>(target: T): UnwrapNestedRefs<T>
export function reactive(target: object) {
  makeReactive(target, false)
  return target
}

export declare const ShallowReactiveMarker: unique symbol

export type ShallowReactive<T> = T & { [ShallowReactiveMarker]?: true }

/**
 * Return a shallowly-reactive copy of the original object, where only the root
 * level properties are reactive. It also does not auto-unwrap refs (even at the
 * root level).
 */
export function shallowReactive<T extends object>(
  target: T
): ShallowReactive<T> {
  makeReactive(target, true)
  def(target, ReactiveFlags.IS_SHALLOW, true)
  return target
}

function makeReactive(target: any, shallow: boolean) {
  // if trying to observe a readonly proxy, return the readonly version.
  if (!isReadonly(target)) {
    if (__DEV__) {
      if (isArray(target)) {
        warn(
          `Avoid using Array as root value for ${
            shallow ? `shallowReactive()` : `reactive()`
// ... (78 more lines)

Domain

Subdomains

Dependencies

Frequently Asked Questions

What does reactive.ts do?
reactive.ts is a source file in the vue codebase, written in typescript. It belongs to the VueCore domain, Instance subdomain.
What functions are defined in reactive.ts?
reactive.ts defines 10 function(s): isCollectionType, isProxy, isReactive, isReadonly, isShallow, makeReactive, markRaw, reactive, shallowReactive, toRaw.
What does reactive.ts depend on?
reactive.ts imports 3 module(s): observer, ref.ts, util.
What files import reactive.ts?
reactive.ts is imported by 5 file(s): apiSetup.ts, apiWatch.ts, computed.ts, readonly.ts, ref.ts.
Where is reactive.ts in the architecture?
reactive.ts is located at src/v3/reactivity/reactive.ts (domain: VueCore, subdomain: Instance, directory: src/v3/reactivity).

Analyze Your Own Codebase

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

Try Supermodel Free