文件名称:vue-transition-router:vue移动端仿APP切换完整实例
文件大小:74KB
文件格式:ZIP
更新时间:2024-06-08 04:27:03
JavaScript
vue移动端路由切换完整实例 在写移动端时,因为需要给页面做转场动画,便有了这次的研究 其中最主要的时以下两个问题: 浏览器导航栏的切换 IOS 上滑动切换时,会有两次页面的转场动画,一次自身滑动时进行的切换,随后触发我们设置的转场动画。 除了上面两个问题,其余的操作都是可以在页面内进行设置,基本都是可控的。主要就是解决上面两个问题。 可以看下实际写出来的效果: 1. 浏览器导航栏的切换 通过记录 历史记录 来比较判断前进还是后退 如下例子 A页面 -> B页面 -> C页面 假如我从 A页面到 B页面 再到C页面,历史记录就会产生3条 我们用一个数组表示: ['/a', '/b', '/c'] 然后我在通过点击浏览器导航栏的后退按钮, 我便会回到 B 页面, 这时候我只要判断是否存在 B页面, 存在就证明我点的时后退按钮。 然后只要我后退过, 我就能点击浏览器的前进按钮了。这时候怎么判断
【文件预览】:
vue-transition-router-master
----index.html(283B)
----postcss.config.js(142B)
----yarn.lock(202KB)
----src()
--------router()
--------main.js(208B)
--------store()
--------utils.js(576B)
--------components()
--------App.vue(2KB)
----.babelrc(369B)
----config()
--------index.js(602B)
----build()
--------build.js(1KB)
--------webpack.dev.conf.js(4KB)
--------webpack.prod.conf.js(5KB)
--------style-loader.js(2KB)
--------vue-config.js(388B)
--------webpack.base.conf.js(2KB)
----README.md(6KB)
----.gitignore(105B)
----package.json(2KB)
----static()
--------.gitkeep(0B)