vue custom directives to automatically get the focus of text boxes

HTML：

<p><b v-show="show">{{tag}}</b><input v-focus v-model="tag" :hidden="show" type="text"></p>

js：

Official example:

directives: {
  focus: {
  // Definition of instructions  inserted: function (el) {
   ()
  }
  }
 }

mine:

directives: {
  focus:function (el) {
   ();
  }
 }

When using the official example in my project, input cannot automatically get the focus. When using my js, you can automatically get the focus. After querying relevant information, you will know that insert is a hook function. As long as the parent node exists, it is called when inserting the parent node. I did not insert it here so it was not called, so I still have to read more and learn more and be careful.

Expand knowledge: vue custom directives Example explanation of autofocus

As shown below:

<el-input v-model="" v-focus placeholder="Please enter content" size="small"></el-input>

Local registration instructions:

 directives: {
  focus: {
  inserted: function (el) {
   [0].focus()
  }
  }
 }

The above method to automatically obtain the focus of the text box in the vue custom command is all the content I share with you. I hope you can give you a reference and I hope you can support me more.