Как обновить один router-view при изменении в другом router-view?

Есть компонент (профиль пользователя) содержащий два router-view с уникальными именами. В одном router-view можно добавлять роли пользователю, в другом можно смотреть список ролей с правами

Как сделать так, чтоб добавив роль в первом router-view обновилась информация во втором router-view?

<template>
      <div class="card">
            <div class="card-body">
                <div class="row">
                    <div class="col-12">
                        <div class="wrap-role">
                            <h3>Список ролей</h3>
                        </div>
                        <router-view name="roles" />
                    </div>
                </div>
            </div>
        </div>
        <div class="card">
            <div class="card-body">
                <div class="row">
                    <div class="col-12">
                        <h3>Список прав пользователя</h3>
                        <router-view name="regulations" />
                    </div>
                </div>
            </div>
        </div>
</template>