Vue-router Positioning to Anchor Point problem

the scrollBehavior implementation of vue-router is used in the project to navigate to the anchor point, which is already used under history mode. The address bar is already localhost:8080/home/basicInfo-sharpvideo, but it is not immediately located but needs to be refreshed to locate the location of the video. No, no, no.
the configuration of scrollBehavior is official: https://github.com/vuejs/vue-.

roughly speaking, there is a parent menu in the parent component to toggle the content displayed in the router-view, while the child menu is to locate the component in the router-view

Vue-router vue.js

Mar.03,2021

according to ide/advanced/scroll-behavior.html-sharp%E6%BB%9A%E5%8A%A8%E8%A1%8C%E4%B8%BA" rel=" nofollow noreferrer "> Vue Router scrolling behavior and example :

const scrollBehavior = function (to, from, savedPosition) {
  if (to.hash) {
    return {
      //  to.hash 
      selector: to.hash
    }
  }
}
const router = new Router({
  routes: routers,
  mode: 'history',
  base: '/',
  scrollBehavior
})

in the menu of the parent component:

<router-link :to="/xxx-sharp0">00000</router-link>
<router-link :to="/xxx-sharp1">00000</router-link>

in the corresponding module of the subcomponent:

<div class="moudle" id="0"></div>
<div class="moudle" id="1"></div>

this enables anchor positioning in history mode.

Previous: The datatable rendered table does not print a background color.

Next: Vue-dragging-usage issues

Vue introduces multiple components in vue-router by nesting named views, and does not refresh the same reference in other pages.
in router.js, because the breadcrumb component is used in multiple pages, the breadcrumb component is referenced by nested named views: { path: Manage , name: , component: function(res) { require([ .. components common layo...

Vue-router vue.js

Feb.26,2021
Vue routing Jump problem
if the current page is under , use < router-link: to= "{path: ,query: {category_id:item.id}} " > jump < router-link > to jump. In fact, the page has no jump effect, can it be processed as similar to the jump effect between different routes? ...

Vue-router vue.js

Feb.27,2021
The vue component is not cached, enter the page to initialize the picture long press event, enter the same component for the second time and cause the long press event to be triggered multiple times?
1. I initialize the long press event 2Router of the picture in mounted. ...

Vue-router vue.js

Feb.28,2021
How to use vue-router, transition and keep-alive together in vue?
my routing switch has the effect of sliding left and right, so that s how I use it. < router-view> < transition> are two transition, one responsible for the animation of the keep-alive component and the other for the animation of the ...

Transition vue-router vue.js

Feb.28,2021
Vue child component, how to query the details according to the id, passed by the parent component and display it in the child component?
if I go to the background to query the details according to the id in the created method of the component, it can be displayed normally without reporting an error, but when the id value of the parent component is changed, it will not be again....

Vuex javascript vue-router vue.js

Feb.28,2021
Is there a way to pass the push parameters of Vue's router without showing the parameters in the url?
is there a way to pass parameters in router of Vue without displaying the parameters in url? http: localhost:8081 id=1&bandwidth=10&user&name=%E6%9C%8D%E5%8A%A1%E5%99%A81&desc=%E6%9C%8D%E5%8A%A1%E5%99%A81&cpu=1%E6%A0%B8&ram=2G...

Vue-router vue.js

Feb.28,2021
When vue router switches pages, Catton: the current page pauses for a while before switching to the new page.
when vue router switches pages, there will be stutters: pauses on the current page (and scrolls to the top) before switching to the new page the address bar changes immediately. Back to the top is the configuration item of the route, indicating that ...

Vuex vue-router vue.js

Mar.01,2021
How to set the navigation menu requested from the background by vue-router?
the front end is built with vue-cli scaffolding, and the menu on the site is requested from the background and is an array object. I would like to ask you, how can the requested data be dynamically combined with vue-router? ...

Vue-router vue.js

Mar.01,2021
The vue, button is traversed by v-for. Click each button to go to the specified page. The routing configuration section will not be written.
< section > <div class="nav"> <div class="nav_con"> <router-link :to="{path:item.link,query:{title:item.title,category_id:item.id}}" class="nav_item" v-for="item in Nav" :k...

Vue-router vue.js

Mar.02,2021
Subcomponents do not execute created () when using vue
1. The code looks like this <a-component> <b-component>< b-component> <router-link :to=" a 1 5" replace>< router-link> < a-component> render the contents of the above component through routing-sh...

Vue-router vue.js

Mar.02,2021
Refreshing the page with parameters in the address bar will report an error.
error content: SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data Technology used in the project node+webpack+vue+vue-router reproduction process: the opening page looks like this: " " id the address bar remains...

Vue-router vue.js

Mar.02,2021
Vue Asynchronous routing style loading problem after webpack Packaging (css Asynchronous loading problem? )
I have a total of five pages, using asynchronous route loading, the last four ways are as follows, so that each routing page is loaded on demand, so as not to load too slowly on the first screen. devstyle npm run buildwebpackvuecssimportcssindexcss ...

Css vue-router vue.js webpack webpack-dev-server

Mar.02,2021
< router-view > render blank < / router-view > without any error?
first contact with vue,vue-router < router-view > render blank < router-view > without any error prompt. Here is the code: App.vue <template> <div id="app"> <router-view>< router-view> < div> < tem...

Vue-router vue.js javascript

Mar.03,2021
Vue routing handoff problem
the problem is as follows ajax :header : Home components <template> <div class="home"> <header class="home-header"> header < header> <div class="scroll...

Vue-router vue.js

Mar.03,2021
Vue-router Jump display Blank problem
this is the route: html: : ...

Webpack vue-router vue.js

Mar.03,2021
The problem of Route Handoff in Vue
questions are as follows: : : you can see that the same content area becomes 0 maybe that s why. but why did the content area become 0? about absolute positioning position:absolute is relative to the first parent element in its containi...

Vue-router vue.js

Mar.03,2021
Error in packing vue-cli project under Linux!
[picture] as shown in the figure, the error in the above figure will occur when packing under Linux. There is no problem with packing locally I don t know what the problem is. Ask for advice ...

Javascript vue-cli vue-router vue.js

Mar.03,2021
Problems encountered in the use of router-link exact
<router-link :to=" detail +userID+ +id" class="peertab" active-class="isactive">< router-link> <router-link :to=" detail +userID+ +id + task "class="peertab" active-class...

Vue-router vue.js

Mar.03,2021
The sibling component cannot transmit information after the vue-router route is redirected
I use vue-router to do two routes, one is the home page, the other page, and then use header to switch routes and do sibling component communication, but found that header can only trigger the home page listeners, when switching routes can not trigger ot...

Vue-router vue.js

Mar.03,2021
Test a project of vue, after deployment to the server, Chrome is normal, refresh is also normal, IE refresh 404
For a project of vue, the vue-router mode is normal after history, is deployed to the server, and the refresh is also normal. If the IE is not refreshed, it can be accessed normally, but refresh or direct link access will be 404. Why? ...

Vue-cli ie-is-compatible-with vue-router vue.js

Mar.04,2021