react-location 高阶组件

Posted 2020-10-14

/**
 * 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} />
        }
    }
};