Redirect
Recirect 可以跳转到另外一个路由中。
props
from
你想开始redirect的地址,包括一些动态的地址。默认为* ,这样任何匹配不到路由规则的情况多回被重定向到另外一个地方。
to
你想要重定向到得路由名字。
params
默认情况下,这些参数将会自动传递到新的路由,你也可以指定他们,特别是你不需要的时候。
query
和params一样
<Route handler={App}> <Route name="contact" handler={Contact}/> <Route name="about-user" path="about/:userId" handler={UserProfile}/> <Route name="course" path="course/:courseId"> <Route name="course-dashboard" path="dashboard" handler={Dashboard}/> <Route name="course-assignments" path="assignments" handler={Assignments}/> </Route> <Redirect from="get-in-touch" to="contact" /> <Redirect from="profile/:userId" to="about-user" /> <Redirect from="profile/me" to="about-user" params={{userId: SESSION.USER_ID}} /> </Route>
Link
用于在应用程序中导航的一种主要方式。Link将会渲染出标签属性href 变得容易被理解。
当Link定位的路由被激活的时候自动 显示为 定义的 activeClassName 和/或者
activeStyle 定义的样式。
Props
to
要被定位到的路由名字,或者是完整的路径
params
包含了名字/值的对象,和路由地址的动态段对应一致。
query
一个包含名字/值 的对象,它会成为地址中的查询参数
var Test = React.createClass({ go_to_test1: function () { this.props.history.pushState(null, '/test1'); }, render: function () { return (<div> <div> <h1>Hello, Remi!</h1> <p> <Link to='/'>home</Link> </p> <p> <Link to='/test1'>To test1</Link> <button onClick={this.go_to_test1}>展示test1</button> </p> <p> <Link to='/test2'>To test2</Link> </p> </div> <div> {this.props.children} </div> </div>); } }); var routes = ( <Router> <Route path="/" component={Test}> <Route path="test1" component={window.Test1}/> <Route path="test2" component={window.Test2}/> </Route> </Router> ); ReactDOM.render(routes, document.getElementById('root'));
相关推荐
对于单页应用,官方提供了vue-router进行路由跳转的处理,这篇文章主要给大家介绍了Vue.js实战之利用vue-router实现跳转页面的相关资料,需要的朋友可以参考借鉴,下面来一起看看吧。
主要给大家介绍了关于react-router实现跳转传值的相关资料,文中给出了详细的示例代码,对大家具有一定的参考学习价值,需要的朋友们下面跟着小编一起来学习学习吧。
主要为大家详细介绍了vue-router实现组件间的跳转,参数传递方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
提供了3种方式实现跳转: ①直接修改地址栏中的路由地址 <!doctype html> <html> <head> <meta charset=UTF-8> <title></title> [removed][removed] <!-- 引入文件 -->...
主要介绍了 Vue 页面跳转不用router-link的实现代码,文中给大家介绍了vue router-link跳转传值示例,需要的朋友可以参考下
包含十几个网页,主要就是练习vue-router简单操作,实现基本跳转,node_modules文件比较大,没有在压缩包里,可以在命令行“nmp i”安装一下,自我感觉写的挺好的,哈哈,大神请绕路!
利用routeros 的url跳转功能实现在路由器上的反劫持,达到输入某个网址自动跳转到指定网址的目的。再也不怕被各类流氓软件劫持主页、降低收益了。内含3.x和5.x版脚本,使用时请自行修改成自己的相关id。
除了使用 创建 a 标签来定义导航链接,我们还可以借助 router 的实例方法,通过编写代码来实现。 router.push(location) 想要导航到不同的 URL,则使用 router.push 方法。这个方法会向 history 栈添加一个新的记录...
vue-router切换时loading效果实现
第一步: 路由 多添加一个自定义字段 requireAuth path: '/repository',...router.beforeEach((to, from, next) => { if (to.meta.requireAuth) { // 判断该路由是否需要登录权限 if (store.state.token) { // 通过v
记录一下在vue项目中如何实现跳转到一个新页面(一个比较简单又比较基础的问题了),有两个方法: 1、标签实现新窗口打开 官方文档中说 v-link 指令被 <router> 组件指令替代,且 <router> 不支持 target=”_blank...
把脚本用记事本打开修改自己的内容然后导入即可。 # ------------------------------------------- # 自已修改2345后面的那个推广ID就可以了 # 2345注册地址:技术员装机设2345.com为主页,终身领工资! ...
1. router-link跳转 // 直接写上跳转的地址 <router to=/detail/one> <span class=spanfour>link跳转 </router> // 添加参数 <router to={path:> </router> // 参数获取 id = this.$route.query.id // 新窗口打开 ...
SAF-Kotlin-Router ...早期参考了rails框架的router功能,它能够非常简单地实现app的应用内跳转,包括Activity之间、Fragment之间实现相互跳转,并传递参数。 本框架的saf-router-compiler、saf-router-annot
当我们在文件中,如果是vue页面中的内部跳转,可以用this.$router.push()实现,但是如果我们还用这种方法跳到外部链接,就会报错,我们一看链接的路径,原来是我们的外部链接前面加上了http://localhost:8080/#/这一...
主要介绍了vue使用vue-router beforEach实现判断用户登录跳转路由筛选,本篇文章默认您已经会使用 webpack 或者 vue-cli 来进行环境的搭建,并且具有一定的vue基础。需要的朋友可以参考下