vue-router – проверяет, является ли дочерним элементом определенной подпрограммы

#javascript #vue.js #vue-router

Вопрос:

Проверил похожие вопросы в stackoverflow, но не смог найти рабочего решения.

Я хочу проверить, является ли подпрограмма дочерним элементом определенного маршрута для отображения контейнера (или нет).

К сожалению, следующее не работает:

 <div v-if="this.$route.matched.some(route => route.path === '/projects')">
   etc.
</div>

Я пытаюсь отображать div контейнер www.example.com/projects снова и снова www.example.com/projects/foo

Я также попытался опустить this .

Спасибо за любые советы!

Ответ №1:

Вы можете использовать

 <div v-if="this.$route.matched.some(route => route.path.includes('/projects')">
   etc.
</div>

метод includes() определяет, содержит ли массив определенное значение среди своих записей, возвращая значение true или false в зависимости от обстоятельств, поэтому www.example.com/projects/foo и www.example.com/projects возвращает true

Ответ №2:

Лучше всего проверить имя маршрута

 ['route1', 'subroute1'].indexOf($route.name) >= 0

Ответ №3:

Если мне нужно скрыть какой-либо div в одном из путей, я использую this.$route.path свойство.

 <div v-if="this.$route.path === '/projects'">
  Display only on views witch route is /projects
</div>

Если вы хотите скрыть div во всех путях, содержащих ‘/projects’, вы можете сделать это таким образом.

 <div v-if="this.$route.path.indexOf('/projects') >= 0">
  Display only on views which contains /projects
</div>