博客

Vue.directive是啥

注册自定义指令，对普通 DOM 元素进行底层操作（虽然，在 Vue2.0 中，代码复用和抽象的主要形式是组件）

例：当页面加载时，该input元素将获得焦点：

// 注册一个全局自定义指令 `v-focus`
Vue.directive('focus', {
  // 当被绑定的元素插入到 DOM 中时……
  inserted: function (el) {
    // 聚焦元素
    el.focus()
  }
})

然后你可以在模板中任何元素上使用新的 v-focus 属性，如下：

<input v-focus>

自定义指令的生命周期？

bind、inserted、update、componentUpdated、unbind五个生命周期钩子

既然有“自定义指令”，那么“指令”是啥

指令 (Directives) 是带有 v- 前缀的特殊 attribute。

<p v-if="seen">现在你看到我了</p>

这里，v-if 指令将根据表达式 seen 的值的真假来插入/移除 p元素。

它们作用于HTML元素，指令提供了一些特殊的特性，将指令绑定在元素上时，指令会为绑定的目标元素添加一些特殊的行为，我们可以将指令看作特殊的HTML特性（attribute）。

指令的作用是当表达式的值改变时，相应地将某些行为应用到 DOM 上。

Vue中的一些指令

1. v-text

v-text主要用来更新textContent，可以等同于JS的text属性。

<span v-text="msg"></span>

这两者等价：

<span>{{msg}}</span>

vue的插件是啥

const myPlugin: PluginObject<any> =  {
	//install的第一个参数是 Vue 构造器，第二个参数是一个可选的选项对象
	install(Vue) {
		// 添加全局资源
		Vue.directive('click-metric', {
			//。。。
		}
		//。。。
	}
}

// use的内部会调用 `myPlugin.install(Vue)`
Vue.use(myPlugin) // 使用插件

.vue后缀的文件是干嘛的？是自动生成的还是手写的？

单文件组件（component，和plugin是两个东西！）

手写的（问这个问题是因为我发现项目下面这文件好多。。。）

Vue Single-File Components (aka *.vue files, abbreviated as SFC) is a special file format that allows us to encapsulate the template, logic, and styling of a Vue component in a single file.