码迷,mamicode.com
首页 > 其他好文 > 详细

react-location 高阶组件

时间:2017-11-18 20:08:07      阅读:188      评论:0      收藏:0      [点我收藏+]

标签:eth   sem   length   str   comm   each   react   else   end   

/**
 * Created by EX-ZHANGLEI009 on 2017/11/1.
 */
import React from ‘react‘;
import { withRouter } from ‘react-router‘
import { method } from ‘./common‘;
@withRouter
export const locationUrl = (MyComponent) =>{
    return class LocationUrl extends React.Component{
        constructor(props){
            super(props);
        }
        get firstUrl(){
            const { params,location } = this.props;
            const isEmptyParams = method.isEmptyObj(params);
            if(isEmptyParams){
                return location.pathname;
            }
            let url = location.pathname;
            Object.keys(params).forEach(item =>{
                url = url.replace(`/${params[item]}`,‘‘);
            });
            return url;
        }
        get secondUrl(){
            const { params,location } = this.props;
            const isEmptyParams = method.isEmptyObj(params);
            if(isEmptyParams){
                return location.pathname;
            }
            const arr = Object.entries(params);
            if(arr.length === 1){
                return location.pathname.replace(`/${arr[0][1]}`,‘‘)
            }else{
                return location.pathname.replace(`/${arr[1][1]}`,‘‘)
            }
        }
        get thirdUrl(){
            const { params,location } = this.props;
            return location.pathname;
        }
        render(){
            const newProps = {
                firstUrl:this.firstUrl,
                secondUrl:this.secondUrl,
                thirdUrl:this.thirdUrl,
            };
            return <MyComponent {...newProps} {...this.props} />
        }
    }
};

 

react-location 高阶组件

标签:eth   sem   length   str   comm   each   react   else   end   

原文地址:http://www.cnblogs.com/leijuan/p/7857616.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!