时间戳

首页 > 解决方案 > Vue触发器中的简单切换功能：您可能有一个无限更新循环

javascript - Vue触发器中的简单切换功能：您可能有一个无限更新循环

问题描述

我已经阅读了一些关于无限更新循环的答案，但仍然不明白这个问题。

我仍然不断收到此错误消息：

[Vue warn]: You may have an infinite update loop in a component render function.

编写简单切换功能的正确Vue方法是什么？看来我的方法是错误的。

<template>
    <v-content>
      <v-container fluid fill-height>
        <v-layout align-center justify-center>
            <v-btn
                color="normal"
                :click="toggleLogin()"
                >
                {{login ? "Register" : "Login"}}
            </v-btn>
        </v-layout>
      </v-container>
    </v-content>
</template>

<script>
export default {
    data: () => ({
        login: true
    }),
    methods: {
        toggleLogin: function() {
            console.log(this.login)
            this.login = !this.login
        }
    }
}

</script>

标签： javascriptvue.js

解决方案

您应该更改数据绑定

:click="toggleLogin()"

到事件处理：

@click="toggleLogin()"

推荐阅读