javascript - 如何使用 vue-router 设置背景颜色

Question

我需要澄清这个问题：我正在使用 vue-router 库来创建我的项目的路由，我需要知道如何通过路由配置背景颜色。我打算这样做：

import meeting from '../components/meeting.vue'
import { colors } from 'vuetify/lib'
Vue.use(VueRouter)
const routes = [
  {
    path: '/meeting/:roomId',
    name: 'meeting',
    component: meeting,
    meta: {
      backgroundColor:colors.transparent ,
     }
  },  
]
const router = new VueRouter({
  routes
});

但这不起作用，请有任何建议

标签： javascriptvue.js

Answer 1

您可以在希望更改背景颜色的组件中查看路线并在其中插入业务逻辑。

要创建观察者，您可以通过以下方式进行：

watch: {
$route.path: function (val) {
  this.backgroundColor = whateverYouWant
},
}

如果您也希望在其他组件中使用此行为，您还可以使用此观察程序创建一个 mixin。