Question

我有一个带有<v-data-table>的组件，其中包含不同的项目。每行中都有一个按钮，用于打开<v-dialog>，该按钮显示有关所选项目的详细信息。我的问题是我不想要一个大组件，而是想要不同的，较小的组件。所以我的问题是如何将要在对话框中显示的项目传递给另一个组件中的对话框？

这是我打开对话框的Vue代码。

<template v-slot:item.open="{ item }">
                <v-tooltip top>
                    <template v-slot:activator="{ on }">
                        <v-icon size="20px" color="green darken-1" v-on="on" @click="openDialog2(item)">
                            mdi-arrow-expand-all
                        </v-icon>
                    </template>
                    <span>Open</span>
                </v-tooltip>

<v-dialog
                v-if="this.dialog2"
                v-model="fullDialog"
                persistent
                max-width="1200"
        >

和将项目移交给对话框的JavaScript代码（如果dialog和<v-data-table>在同一组件中，则可以使用

 openDialog2(item) {
                this.fullDialog = Object.assign({}, item);
                this.dialog2 = true;
            }

感谢您的帮助！非常感谢。

Answer 1

有一种我更愿意这样做的正确方法。

Vuex 状态管理（https://vuex.vuejs.org/）

每当我认为let circleMask; let myImage; function setup() { createCanvas(400, 400); circleMask = createGraphics(128, 128); myImage = loadImage('FzFH41IucIY.jpg'); } function draw() { background(255); circleMask.fill('rgba(0, 0, 0, 1)'); circleMask.circle(64, 64, 128); myImage.mask(circleMask); image(myImage, 200 - 64, 200 - 64, 128, 128); }可以共享给不同的组件时，我相信data管理是做到这一点的最佳方法。 为什么不支持以及何时使用vuex -正如您提到的，许多不同的小state希望阅读components或data，因此您通过时几乎没有多余的余地manipulate处于很深的层次或不同的层次结构中。了解如何在项目引用https://vuex.vuejs.org/guide/中包含prop。

状态管理是真理的唯一来源，当任何要访问任何状态的组件都可以简单地读取状态，而最好的部分是，如果任何组件更改了状态，则使用相同状态的所有其他组件都具有反射性，因为它绑定到{ {1}}反应性。

我说vuex是指您希望传递给组件的vue

有没有办法将项目传递给VueJS另一个组件中的对话框？

1 个答案: