Vue62-$nextTick和$event

一、$nextTick

1-1、需求

点击编辑按钮，文本框自动获取焦点。

没有生效！因为vue是将function中的代码执行完，再重新解析模版，所以存在时间上的问题。

解决方式一：使用定时器

解决方式二：$nextTick

$nextTick所制定的回调函数，会在DOM节点更新之后，再执行！

1-2、小结：

二、$event

在 Vue.js 中，$event 是一个特殊的变量，通常用于模板中的事件处理器（如 @click、@input 等）。

当你在模板中为一个事件提供一个方法，并希望在方法内部访问该事件的一些详细信息（如鼠标位置、键盘按键等）时，你可以使用 $event 作为参数。 

<template>  
  <div>  
    <button @click="handleClick($event)">点击我</button>  
  </div>  
</template>  
  
<script>  
export default {  
  methods: {  
    handleClick(event) {  
      // 这里我们可以访问到原生 DOM 事件对象  
      console.log(event.type); // 输出 "click"  
      console.log(event.target); // 输出被点击的 <button> 元素  
      // ... 以及其他事件属性  
    }  
  }  
}  
</script>

在上述示例中，当按钮被点击时，handleClick 方法会被调用，并且 $event（在这里我们将其命名为 event）会被作为参数传递给该方法。然后，我们可以在方法内部访问该事件对象的各种属性，如 event.type（事件类型）、event.target（触发事件的 DOM 元素）等。