vue Architecture Docs
Home / File/ attrs.ts — vue Source File

attrs.ts — vue Source File

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

File typescript ServerRenderer BundleRenderer 6 imports 3 dependents 2 functions

Entity Profile

Dependency Diagram

graph LR
  f549c274_b375_8785_e025_a5d238ba23a1["attrs.ts"]
  89eacf5c_deee_e42e_d519_69cb05e48e63["util.ts"]
  f549c274_b375_8785_e025_a5d238ba23a1 --> 89eacf5c_deee_e42e_d519_69cb05e48e63
  4e8211dc_aa7e_481a_3002_b46e9e8afd4e["escape"]
  f549c274_b375_8785_e025_a5d238ba23a1 --> 4e8211dc_aa7e_481a_3002_b46e9e8afd4e
  47f8c312_7314_9cbf_cfdb_5b24401f4a11["isSSRUnsafeAttr"]
  f549c274_b375_8785_e025_a5d238ba23a1 --> 47f8c312_7314_9cbf_cfdb_5b24401f4a11
  09aa5370_2caa_6b33_3f44_6ac5211bd11b["util"]
  f549c274_b375_8785_e025_a5d238ba23a1 --> 09aa5370_2caa_6b33_3f44_6ac5211bd11b
  25eda96e_d536_1889_d475_255d9ddf047a["attrs"]
  f549c274_b375_8785_e025_a5d238ba23a1 --> 25eda96e_d536_1889_d475_255d9ddf047a
  ba925ef2_b0f4_efe3_c23d_fe293c46b2c1["vnode"]
  f549c274_b375_8785_e025_a5d238ba23a1 --> ba925ef2_b0f4_efe3_c23d_fe293c46b2c1
  6c8aaa22_3be8_0715_bdbe_23562ffc07d2["dom-props.ts"]
  6c8aaa22_3be8_0715_bdbe_23562ffc07d2 --> f549c274_b375_8785_e025_a5d238ba23a1
  541324d1_64ab_2ed6_961a_c199b29f9df6["index.ts"]
  541324d1_64ab_2ed6_961a_c199b29f9df6 --> f549c274_b375_8785_e025_a5d238ba23a1
  b5390896_1fe7_f1d9_81bd_c577287dddd4["runtime-helpers.ts"]
  b5390896_1fe7_f1d9_81bd_c577287dddd4 --> f549c274_b375_8785_e025_a5d238ba23a1
  style f549c274_b375_8785_e025_a5d238ba23a1 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import { escape } from '../util'

import { isDef, isUndef, extend } from 'shared/util'

import {
  isBooleanAttr,
  isEnumeratedAttr,
  isFalsyAttrValue,
  convertEnumeratedValue
} from 'web/util/attrs'

import { isSSRUnsafeAttr } from '../util'
import type { VNodeWithData } from 'types/vnode'

export default function renderAttrs(node: VNodeWithData): string {
  let attrs = node.data.attrs
  let res = ''

  const opts = node.parent && node.parent.componentOptions
  if (isUndef(opts) || opts.Ctor.options.inheritAttrs !== false) {
    let parent = node.parent
    while (isDef(parent)) {
      // Stop fallthrough in case parent has inheritAttrs option set to false
      if (
        parent.componentOptions &&
        parent.componentOptions.Ctor.options.inheritAttrs === false
      ) {
        break
      }
      if (isDef(parent.data) && isDef(parent.data.attrs)) {
        attrs = extend(extend({}, attrs), parent.data.attrs)
      }
      parent = parent.parent
    }
  }

  if (isUndef(attrs)) {
    return res
  }

  for (const key in attrs) {
    if (isSSRUnsafeAttr(key)) {
      continue
    }
    if (key === 'style') {
      // leave it to the style module
      continue
    }
    res += renderAttr(key, attrs[key])
  }
  return res
}

export function renderAttr(key: string, value: string): string {
  if (isBooleanAttr(key)) {
    if (!isFalsyAttrValue(value)) {
      return ` ${key}="${key}"`
    }
  } else if (isEnumeratedAttr(key)) {
    return ` ${key}="${escape(convertEnumeratedValue(key, value))}"`
  } else if (!isFalsyAttrValue(value)) {
    return ` ${key}="${escape(String(value))}"`
  }
  return ''
}

Domain

Subdomains

Functions

Dependencies

Imported By

Source

Frequently Asked Questions

What does attrs.ts do?
attrs.ts is a source file in the vue codebase, written in typescript. It belongs to the ServerRenderer domain, BundleRenderer subdomain.
What functions are defined in attrs.ts?
attrs.ts defines 2 function(s): renderAttr, renderAttrs.
What does attrs.ts depend on?
attrs.ts imports 6 module(s): attrs, escape, isSSRUnsafeAttr, util, util.ts, vnode.
What files import attrs.ts?
attrs.ts is imported by 3 file(s): dom-props.ts, index.ts, runtime-helpers.ts.
Where is attrs.ts in the architecture?
attrs.ts is located at packages/server-renderer/src/modules/attrs.ts (domain: ServerRenderer, subdomain: BundleRenderer, directory: packages/server-renderer/src/modules).

Analyze Your Own Codebase

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

Try Supermodel Free