VUE: вызывающий компонент из другого компонента генерирует [Vue warn]: возможно, имеется бесконечное обновление l oop в ошибке функции рендеринга компонента - PullRequest
0 голосов
/ 14 апреля 2020

У меня есть основной компонент и компонент диалога.
У меня есть событие щелчка в главном компоненте, которое увеличивает переменную и передает ее компоненту диалога, и проверяет в watch, изменяется ли оно, и если это так, оно открывает диалоговое окно.
Это выглядит так

MainComponent. vue

<template>
<div>
    <vs-card @click.native="openDetails()">
        ....content here....
    </vs-card>
</div>
<DialogComponent :dialog_component_watcher:="dialog_component_watcher"></DialogComponent>
</template>

<script>
import DialogComponent from './shared/DialogComponent.vue';

export default {
     name: 'main-component',
     component: {DialogComponent}
     data: () => ({
        dialog_component_watcher: 1
     }),
     methods: {
         openDetails() {
             this.dialog_component_watcher++;
         }
     }
    }
</script>


DialogComponent. vue

<template>
<div>
    <v-dialog v-model="dialog">
    </vdialog>
</div>
</template>
<script>
    export default {
        props: ['dialog_component_watcher'],
        name: 'dialog-component',
        data: () => ({
            dialog: false
        }),
        watch: {
            dialog_component_watcher: function(val) {
                if(val) {
                    this.dialog = true;
                }
            }
        }
    }
</script>

Я сделал это на других моих компонентах, и это работает без ошибок.
Но на этом есть ошибка, говорящая: **[Vue warn]: You may have an infinite update loop in a component render function.**

...