作者热门文章
- c - 在位数组中找到第一个零
- linux - Unix 显示有关匹配两种模式之一的文件的信息
- 正则表达式替换多个文件
- linux - 隐藏来自 xtrace 的命令
我正在开发一个 Vue.js 应用程序,但我无法将 anchor 链接到组件中的某个 div。
我有以下 anchor :
<a href="#porto" class="porto-button">Porto, Portugal</a>
和下面的 div:
<div id="porto" class="fl-porto">
我在散列模式下使用 vue-router。
问题是,每当我单击“porto-button”时,它都会将我重定向到“主页”页面 ( '/' )
我正在使用 Vue.js 1.X,我尝试使用历史记录模式(没有 hashbang 的 URL),但它在刷新页面时给我一个 cannot GET '/page'
错误。
我做错了什么吗?我该怎么办?
最佳答案
因为您在散列模式下使用路由器,您将无法轻松滚动,因为滚动到 /#something
实际上会将您重定向到“something”页面。
你必须自己模拟滚动行为,尝试做类似的事情:
//P.S. the code is written for Vue 2.
//You will have to adjust it to Vue 1.
//Your view:
<a class="porto-button" @click="scrollMeTo('porto')">Porto, Portugal</a>
...
<div ref="porto" class="fl-porto">
//Your code:
methods: {
scrollMeTo(refName) {
var element = this.$refs[refName];
var top = element.offsetTop;
window.scrollTo(0, top);
}
}
工作原理:
ref
属性将引用设置为您要滚动到的元素;window.scrollY
设置为引用元素的 top
。更新 1:
jsfiddle https://jsfiddle.net/5k4ptmqg/4/
更新 2:
似乎在 Vue 1 中 ref="name"
看起来像 el:name
(docs) ,这是一个更新的例子:
关于html - Vue.js 锚定到同一组件内的 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42645964/
我正在实现谱聚类算法,我必须确保矩阵(拉普拉斯矩阵)是半正定矩阵。 检查矩阵是否为正定矩阵 (PD) 就足够了,因为可以在特征值中看到“半”部分。矩阵非常大(nxn,其中 n 是几千的数量级)所以特征
我是一名优秀的程序员,十分优秀!