6. Vue实例选项——自定义资源

85 阅读1分钟

1. directives——Vue 实例自定义指令

  • 类型Object
  • 详细

包含 Vue 实例可用指令的哈希表。

image.png

image.png

2. filters——Vue 实例自定义过滤器

  • 类型Object
  • 详细

包含 Vue 实例可用过滤器的哈希表。

image.png

当页面匹配到  |  这个符号,就知道你用过滤器,然后就解析成  _f 去获取对应过滤器 并调用;

_f 会在Vue 初始化的时候,注册到 Vue 的原型上;

_f 是 resolveFilter,一个可以获取 具体filter 的函数

<div>{{parentName|all }}</div>
(function() {      
    with(this) {            
        return _c('div',[                
            _v(_s(_f("all")(parentName)))            
        ])      
    }
}
//1. _c 是渲染组件的函数,这里会渲染出根组件

//2、这是匿名自执行函数,后面渲染的时候调用,会 绑定当前实例为作用域

//3、with 的作用是,绑定大括号内代码的 变量访问作用域,所以里面的所有变量都会从 实例上获取

//然后,你可以看到  ' parentName | all '  被解析成  _f('all')( parentName )
// 使用 _f("all") 就能获取到 all 这个过滤器

image.png

image.png

3. components——Vue 实例的局部子组件

  • 类型Object
  • 详细

包含 Vue 实例可用组件的哈希表。

image.png

image.png