Vue触发器中的简单切换功能:您可能有无限的更新循环

时间:2019-07-16 19:59:55

标签: javascript vue.js

我已经阅读了有关无限更新循环的一些答案,但仍然不了解该问题。

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

[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>

1 个答案:

答案 0 :(得分:1)

您应该更改数据绑定

:click="toggleLogin()"

事件处理:

@click="toggleLogin()"