草庐IT

Vue-router

全部标签

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 - Vue 中的去抖计算属性/getter

我似乎无法去除(lodash)计算属性或vuexgetter。去抖函数总是返回未定义。https://jsfiddle.net/guanzo/yqk0jp1j/2/HTML:computed:{{textComputed}}debounced:{{textDebounced}}JS:newVue({el:'#app',data:{text:''},computed:{textDebounced:_.debounce(function(){returnthis.text},500),textComputed(){returnthis.text}}}) 最佳答案

javascript - 为什么 Vue.js 使用 VDOM?

AccordingtoVue.js'documentation,它在底层使用VDOM来呈现UI。据我了解,VDOM的发明主要是为了避免“跟踪依赖”。使用VDOM,可以在不知道到底发生了什么变化的情况下协调应用程序的更大部分。因此,可以使用普通对象和数组来描述View,只需要通知框架有关更改(如React中的setState)。然后,比较两个VDOM树并将所需的最小更改集应用到真实的DOM。另一方面,Vue.js使用跟踪依赖项。它确切地知道发生了什么变化,因此可以使用DOM绑定(bind)。此外,由于大多数Vue.js用户已经在使用模板语言,因此它并没有真正受益于VDOM提供的更大灵ac

javascript - 使用 React 或 Vue 增强多页面应用程序的某些部分

我正在服务器端使用java&hibernate&springmvc开发企业应用程序并使用jquery在客户端(不是SPA)。现在在搜索页面中,我使用ajax并仅获得json响应,但我不想在每个搜索或分页请求中都写如下内容。function(ajaxData){....$('#search').html(''+''+''+''+ajaxData.title+''+......''+'')....}我认为使用jsx和react或vuecomponent只是在这个页面刷新结果。我还想重用一些htmlblock,我认为使用react或vue会很容易我曾经构建过一个小的SPA项目,它都是关于np

javascript - 使用 Vue.js 的异步/等待 axios 调用

我在设置其中一个时遇到了一些麻烦。我的Vue.js应用程序中的值。我相信我要么没有正确理解异步axios调用,要么没有理解异步在Vue.js中的工作方式。我有以下三种方法:updateAvailability(availability){if(availability==true){this.showYourDetails();}else{this.showBookingDetails();}},checkAvailability:asyncfunction(event){event.preventDefault();constavailability=awaitthis.handle

javascript - Vue 子组件属性不起作用

我正在尝试破解此代码[A](请参阅底部的fiddle):{{file.__progress}}%进入[B]基本相同的代码,但随后带有一个子组件。这里是父级:这里是child:{{file.__progress}}%在child身上我设置了file属性:props:{file:{type:File,required:true}},父子代码中一定存在问题,因为file__img属性在[B]中的子项(渲染时)中不存在,请参阅:,而它确实存在于[A]中:怎么了?控制台没有错误。原始([A])代码来自here.FileObject由一个xhr实例组成(我想?!)。这里是[A]的fiddle/沙盒

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}})});}}我想将此数据传