在 vue.js 中加载页面或视图后如何设置点击事件？

在本文中，我们将讨论如何在 vue.js 中加载页面或视图后设置点击事件。就像所有其他 JavaScript 框架一样，Vue 也支持挂载钩子。安装挂钩通常是最常用的挂钩。它们允许我们在第一次渲染之前或之后访问或修改组件的 DOM。

所以，这里我们将使用mounted hook在页面加载时触发点击事件。

设置环境的步骤：

1. 首先，我们应该使用以下命令安装 vue.js：

   sudo npm install -g @vue/cli

2. 之后，安装 vue.js。您可以使用以下命令创建一个新项目：

   vue create test

3. 现在，通过使用转到您的项目文件夹

   cd myapp

4. 您可以使用以下命令运行您的项目：

   npm run serve

您的项目的文件结构将如下所示：

句法

• 第 1 步：提供要单击的按钮的引用。

  Click

• Step-2:在挂载的钩子上触发按钮点击。

  mounted () {
    this.$refs.Btn.click()
  }

示例：从测试项目 src 文件夹中打开您的App.vue文件并更新代码。

Javascript

export default({
  methods: {
    logClicked () {
      console.log('Clicked')
    }
  },
  mounted () {
    this.$refs.Btn.click()
  }})

Output For 可以通过键入localhost:8080在 chrome 中查看输出，也可以使用以下命令在 Chrome 浏览器中打开控制台

ctrl+shift+j