在 Vuetify 和 Vue JS 中将 prop 传递给父级

Question

如何将暗模式值从导航栏（子）传递给 app.vue（父）？

在我的导航栏组件中，我有一个启用/禁用暗模式的开关。我想将这些暗数据传递给父级 (app.vue) 以更改整个应用程序。

谢谢！

Answer 1

您可以使用 Vue 的自定义事件接口。 https://vuejs.org/v2/guide/components-custom-events.html

在您的子导航栏组件中，您可以有一个方法：

handleThemeChange: function (mode) {
    this.$emit('handle-theme-change', { mode });
}

然后在您的父 App 组件中监视该事件：

<App v-on:handle-theme-change="handleThemeChange" />

然后您的应用程序组件可以有一个方法handleThemeChange 来实际处理更改。应用程序组件中的 handleThemeChange 方法将接受该对象作为参数。