vuejs中的失去焦点事件怎么用

这篇文章将为大家详细讲解有关vuejs中的失去焦点事件怎么用，小编觉得挺实用的，因此分享给大家做个参考，希望大家阅读完这篇文章后可以有所收获。

vuejs中的失去焦点事件是“@blur”，当元素失去焦点时会触发该事件，使用方法：在标签模板中添加“@blur="事件处理函数"”语句绑定事件，使用JavaScript设置触发事件时需要执行的代码即可。

本教程操作环境：windows7系统、vue2.9.6版，DELL G3电脑。

@blur 是当元素失去焦点时所触发的事件

@focus是元素获取焦点时所触发的事件

示例：

 <template>
  <div>
    <!--
    @blur 当元素失去焦点时触发blur事件
    -->
    <div>
      <input type="text" placeholder="请输入内容" @blur="blurText"/>
    </div>
 
  </div>
</template>
 
<script>
    export default {
      name: "commitText",
      methods:{
        blurText(){
          console.log("blur事件被执行了")
        }
      }
    }
</script>
 
<style scoped>
 
</style>

关于“vuejs中的失去焦点事件怎么用”这篇文章就分享到这里了，希望以上内容可以对大家有一定的帮助，使各位可以学到更多知识，如果觉得文章不错，请把它分享出去让更多的人看到。