时间戳

首页 > 解决方案 > VueJS 最好的方式将 css 从孩子应用到父母

vue.js - VueJS 最好的方式将 css 从孩子应用到父母

问题描述

VueJS 将 css 从孩子应用到父母的最佳方式是什么？我有很多页面布局left\right\menu\tables\colunm\etc。所有路线都以深度路径呈现。今天有页面（组件）需要将 css 样式应用于 N 级以上的父级。我该怎么做？

标签： vue.jsvuejs2vue-componentvue-router

解决方案

您可以在全局级别创建一个简单的 EventBus：

const eventBus = new Vue();

接着eventBus.$emit('signal-name', ...args)

然后你可以做一系列的事情，比如

eventBus.$on(name, callback)-> 创建一个监听器来接收发射

eventBus.$once(name, callback)-> 接收一次并移除监听器

eventBus.$off(name, callback)-> 移除监听器

您可以传递一些布尔值或 CSS 类：

eventBus.$emit('signal-name', true)-> 然后根据它显示一些东西 eventBus.$emit('signal-name', ['is-white', 'is-bold'])

注意：对于$off：

  * If no arguments are provided, remove all event listeners;
  * If only the event is provided, remove all listeners for that event;
  * If both event and callback are given, remove the listener for that specific callback only.

推荐阅读