vue.js - 如何在 vue js 中以编程方式隐藏模态

Question

我正在尝试在 vue js 2 中创建一个组件。它是一个模态组件。其功能只是提醒用户成功查询数据库或出现错误。因此，无论用户提交表单成功与否，都会显示此模态组件。我确实成功地展示了它，但问题是我想在它显示后的几秒钟内自动隐藏它。我怎样才能在 vue JS 中实现这一点。

Answer 1

使用setTimeout JavaScript 函数。

showModal(){
   var self = this;
   self.modalActive = true;
   setTimeout(function(){
      self.modalActive = false; // Use your variable name
   }, 5 * 1000); // Hide after 5 secs
}