D
D
Darkness2019-12-25 08:51:44
Vue.js
Darkness, 2019-12-25 08:51:44

How to open a modal window when opening a page via router-link?

Problem:
You need to go to the page by clicking on and open a modal window with the id of the clicked element.
Example:
On page N we have several elements. Each has its own id. When clicking on any element, we should get to the page where there are all these elements (this works), and after that, a modal window should immediately open with the id of the element that was clicked on on the last page.
Stack:
Vue.js, Element-UI
My Router:
I know that id is missing, but I don't understand how to implement it.

{
      path: '/n',
      name: 'n',
      component: n,
      meta: {menuIndex: 'n', title: 'n'}
 }

Answer the question

In order to leave comments, you need to log in

2 answer(s)
V
Vladimir Matsuev, 2019-12-25
@vkinder

in the route on the page with all elements in the path, the id should be passed:
where the transition occurs, there should be something like this (transition to the page with modals):
in the component where the modal should open, you need a url handler and a call to open the modal by id:

mounted () {
  const idModal = this.$router.currentRoute.params.id

  if (idModal) {
    this.openModalById(idModal )
  }
}

A
Aetae, 2019-12-26
@Aetae

For good - should be done as suggested by Vladimir Matsuev .
But if you need to pass the id on the sly, then you can simply make the transitions like this:

$router.push({ path: '/n/', params: { id: '123' } )
, and in the component, respectively, follow $route.params.id.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question