js教程从入门到精通,编程必背50个代码

• 指令的定义

指令（Directives）是带有 v- 前缀的特殊属性。指令属性的值预期是单一 JavaScript 表达式（除了 v-for，之后再讨论）。指令的职责就是当其表达式的值改变时相应地将某些行为应用到 DOM 上

• 有哪些指令

上面我们学到了模板语法，其中v-if,v-model等等都是官方封装好的指令，但有时候我们需要自己定义属于自己的指令

• 指令解决的问题

vue.js开发应用的时候，大多时候，vue是不支持我们用DOM去看开发的，但有时候我们必须使用DOM的方式去解决一些问题，比如在用户点击购买按钮的时候会弹出一个信息输入组件，我们往往需要弹出的信息输入框会自动聚焦，方便用户的输入。这时候我们就需要写一个自动对焦的指令

• 首先我们先创建一个指令

代码

• 将指令引入入口文件main.js

import './directives'

• 在需要绑定的元素上绑定自定义指令v-focus

代码

代码

页面——我们在页面添加一个购买按钮，当用户点击按钮，会弹出一个蒙版输入框，这时候输入框会自动获得焦点。

点击前

点击前的页面

点击购买后——可以看到，这时候输入框已经自动获得焦点了