Home / File/ model.ts — vue Source File

model.ts — vue Source File

Architecture documentation for model.ts, a typescript file in the vue codebase. 4 imports, 1 dependents.

File typescript WebPlatform RuntimeModules 4 imports 1 dependents 9 functions

Entity Profile

Dependency Diagram

graph LR
  c5669fa5_f589_5187_60a1_228b9a62ccc3["model.ts"]
  2c8b481d_d43d_0baa_2ed5_d309549d5e69["element"]
  c5669fa5_f589_5187_60a1_228b9a62ccc3 --> 2c8b481d_d43d_0baa_2ed5_d309549d5e69
  156bf2e1_8a13_f22d_5437_54f14bcef8fa["util"]
  c5669fa5_f589_5187_60a1_228b9a62ccc3 --> 156bf2e1_8a13_f22d_5437_54f14bcef8fa
  c078cebd_36ee_e879_0a89_19cf4b3ed9a7["index"]
  c5669fa5_f589_5187_60a1_228b9a62ccc3 --> c078cebd_36ee_e879_0a89_19cf4b3ed9a7
  02e43f4a_da65_7acd_5a98_0f017554a159["index"]
  c5669fa5_f589_5187_60a1_228b9a62ccc3 --> 02e43f4a_da65_7acd_5a98_0f017554a159
  72ec008b_b63e_cd79_66ff_0a6020716719["index.ts"]
  72ec008b_b63e_cd79_66ff_0a6020716719 --> c5669fa5_f589_5187_60a1_228b9a62ccc3
  style c5669fa5_f589_5187_60a1_228b9a62ccc3 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

/**
 * Not type checking this file because flow doesn't like attaching
 * properties to Elements.
 */

import { isTextInputType } from 'web/util/element'
import { looseEqual, looseIndexOf } from 'shared/util'
import { mergeVNodeHook } from 'core/vdom/helpers/index'
import { warn, isIE9, isIE, isEdge } from 'core/util/index'

/* istanbul ignore if */
if (isIE9) {
  // http://www.matts411.com/post/internet-explorer-9-oninput/
  document.addEventListener('selectionchange', () => {
    const el = document.activeElement
    // @ts-expect-error
    if (el && el.vmodel) {
      trigger(el, 'input')
    }
  })
}

const directive = {
  inserted(el, binding, vnode, oldVnode) {
    if (vnode.tag === 'select') {
      // #6903
      if (oldVnode.elm && !oldVnode.elm._vOptions) {
        mergeVNodeHook(vnode, 'postpatch', () => {
          directive.componentUpdated(el, binding, vnode)
        })
      } else {
        setSelected(el, binding, vnode.context)
      }
      el._vOptions = [].map.call(el.options, getValue)
    } else if (vnode.tag === 'textarea' || isTextInputType(el.type)) {
      el._vModifiers = binding.modifiers
      if (!binding.modifiers.lazy) {
        el.addEventListener('compositionstart', onCompositionStart)
        el.addEventListener('compositionend', onCompositionEnd)
        // Safari < 10.2 & UIWebView doesn't fire compositionend when
        // switching focus before confirming composition choice
        // this also fixes the issue where some browsers e.g. iOS Chrome
        // fires "change" instead of "input" on autocomplete.
        el.addEventListener('change', onCompositionEnd)
        /* istanbul ignore if */
        if (isIE9) {
          el.vmodel = true
        }
      }
    }
  },

  componentUpdated(el, binding, vnode) {
    if (vnode.tag === 'select') {
      setSelected(el, binding, vnode.context)
      // in case the options rendered by v-for have changed,
      // it's possible that the value is out-of-sync with the rendered options.
      // detect such cases and filter out values that no longer has a matching
      // option in the DOM.
      const prevOptions = el._vOptions
// ... (89 more lines)

Domain

Subdomains

Dependencies

  • element
  • index
  • index
  • util

Frequently Asked Questions

What does model.ts do?
model.ts is a source file in the vue codebase, written in typescript. It belongs to the WebPlatform domain, RuntimeModules subdomain.
What functions are defined in model.ts?
model.ts defines 9 function(s): actuallySetSelected, directive.componentUpdated, directive.inserted, getValue, hasNoMatchingOption, onCompositionEnd, onCompositionStart, setSelected, trigger.
What does model.ts depend on?
model.ts imports 4 module(s): element, index, index, util.
What files import model.ts?
model.ts is imported by 1 file(s): index.ts.
Where is model.ts in the architecture?
model.ts is located at src/platforms/web/runtime/directives/model.ts (domain: WebPlatform, subdomain: RuntimeModules, directory: src/platforms/web/runtime/directives).

Analyze Your Own Codebase

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

Try Supermodel Free