草庐IT

Lan-Router

全部标签

javascript - React Router v4 - 切换组件时保持滚动位置

我有两个s使用react-router创建。/cards->纸牌游戏列表/cards/1->纸牌游戏#1的详细信息当用户点击“返回列表”时,我想将用户滚动到他在列表中的位置。我该怎么做? 最佳答案 工作示例在codesandboxReactRouterv4不提供开箱即用的滚动恢复支持,就目前而言,它们也不会。在ReactRouterV4-ScrollRestoration部分在他们的文档中,您可以阅读更多相关信息。因此,由每个开发人员编写逻辑来支持这一点,尽管我们确实有一些工具来实现这一点。element.scrollIntoVie

javascript - React-router 不显示组件

我目前正在学习react-router,然后尝试在示例应用中实现它。这是我的代码:index.htmlSampleAPP/src/app.jsxvarReact=require('react');varReactDOM=require('react-dom');varRoutes=require('./routes');ReactDOM.render(Routes,document.getElementById('main'));/src/routes.jsxvarReact=require('react');varRouter=require('react-router').Rout

javascript - 如何访问 reducer (redux-router)中的当前位置?

我如何使用reducer中的redux-router获取当前路径和当前位置的查询。我可以使用mapStateToProps在组件内部轻松获取路径名,但我想访问reducer中的当前路径。我正在使用redux-router1.0.0-beta7,react-router1.0.3。 最佳答案 1.way-通过redux-thunk传递带有特定action的路径名和getState()constsomeAction=data=>(dispatch,getState)=>{dispatch({type:'SOME_ACTION',path

javascript - 当 ui-router 状态改变时运行 javascript 函数?

在Angular应用程序中,我使用ui-router来处理导航等。在一个单独的脚本文件中,我有一个这样的函数;$(function(){functiondoSomething(){if($('.thisclass').length){$('.thisclass').css({'height':someHeight});}}});我的问题是,每当状态发生变化时,我都想运行上面的函数。但是因为它不是任何Angular函数的一部分,所以当我引用它时出现错误,因为我找不到它。我应该做什么,而不是上面的? 最佳答案 您好,您还可以将您的jqu

javascript - 按类型排除 React Router 中路径参数的值

我对路由组件有点困惑。想象一下,我有这两条路线,它们有自己的路径:/person/add应该显示一个表单,我可以在其中创建一个新的Person/person/:id应该显示一个具有给定ID的人。问题>>如果我导航到/person/add它也会显示/person/:id的组件,因为字符串“add”对":id".有什么办法可以避免这种情况吗?例如告诉:id应该是一个数字? 最佳答案 找到一个可能的解决方案:您可以在路线周围使用Switch。然后它将只匹配第一个匹配的。 关于javascrip

javascript - 如何使用 IIS 设置 react-router clear URL?

React-Router通过简单的路由组件使您的ReactJS应用程序成为SPA。部署到IIS时,使用bashHistory进行设置时一切正常。但是,当我尝试使用browserHistory时,IIS试图返回一个目录,而不是让React-Router获取并解析路由。如何设置React-Router以在IIS环境中工作? 最佳答案 让React-Router与IIS一起工作的关键是设置URL重写规则。在查看其他人如何使用IIS设置AngularJSSPA应用程序后,我想出了以下解决方案。下载并安装URLRewrite在您的服务器上(开

javascript - React-router - 如何在 React 中的页面之间传递数据?

我正在做一个项目,我必须将数据从一个页面传递到另一个页面。例如,我在第一页上有data。letdata=[{id:1,name:'Ford',color:'Red'},{id:2,name:'Hyundai',color:'Blue'}]这是第一个组件页面,我在其中呈现带有名称的数据列表。classListDetailextendsComponent{constructor();handleClick(data){console.log(data);}render(){return({data.map((data,i)=>{return{data.name}})});}}我想将此数据传

javascript - $stateChangeStart 在 UI-Router ES6 中的状态变化时没有被触发?

我正在为ES6和webpack使用Bable。我在angular1.x.x上构建应用程序。到现在为止我没有遇到任何问题。我想要一个可以跟踪所有路线变化的功能。我正在使用UI路由器。问题是$stateChangeStart无论如何都不会被触发。代码如下。/*Allincludesaretakencareof.Pleaselookattherunmethod*/angular.module('chpApp',[uirouter,angular_animate,uibootstrap,formly,formlyBootstrap,ngMessages,angularLoadingBar,'n

javascript - 使用 gulp 进行丑化时,Angular-ui-router 会中断

我有以下简单的angular.js应用程序,遵循概述的最佳实践here.angular.module('myApp',['ui.router']);(function(){functionroutes($stateProvider,$urlRouterProvider){$urlRouterProvider.otherwise("/404");$stateProvider.state('createCluster',{url:'/create-cluster',templateUrl:'templates/create-cluster.html'})}angular.module('m

javascript - 使用 react-router-redux 访问参数

我正在使用react-router-redux(https://github.com/ReactTraining/react-router/tree/master/packages/react-router-redux)安装npminstall--savereact-router-redux@next这样实现:我正在尝试访问容器中id的参数,如下所示:constmapStateToProps=(state,ownProps)=>{console.log(ownProps)return{...state.resource,id:ownProps.params.id}}如react-rou