संपादित करें: प्रतिक्रिया-राउटर वैकल्पिक पैरा का उपयोग करने के बजाय मैं इसके आसपास कैसे गया, इसका उत्तर पोस्ट किया।

किसी कारण से, जब मैं वैकल्पिक प्रतिक्रिया-राउटर मार्ग/यूआरएल पर जाता हूं तो यूआरएल से जुड़े वैकल्पिक पैरा के साथ मुझे एक त्रुटि मिलती है। मैं यूआरएल में वैकल्पिक परम एसआरसी को शामिल करके यह ट्रैक करने की कोशिश कर रहा हूं कि उपयोगकर्ता कहां से आया है। मैंने/ref=testing,/src=testing,/testing से :referrer के रूप में सब कुछ करने की कोशिश की है? और वे शायद लोकलस्टोरेज में सेव करेंगे, लेकिन फिर भी कंसोल GET रिक्वेस्ट बढ़ाएंगे।

यहाँ मेरा App.js कैसा दिखता है:

<Route exact path="/profile/user/:user/:referrer?" component={ ProfileById } />

: उपयोगकर्ता नेवला संरचना में उपयोगकर्ता आईडी है। :संदर्भकर्ता? स्रोत है = (जो कुछ भी है)

यहाँ मार्ग के लिए मेरा स्वयंसिद्ध अनुरोध है:

export const getProfileByUserId = (user) => dispatch => {
dispatch(setProfileLoading());
axios.get(`/profile/user/${user}`)
    .then(res => 
        dispatch({
            type: GET_PROFILE,
            payload: res.data
        })    
    )
    .catch(err => 
        dispatch({
            type: GET_PROFILE,
            payload: null
        })   
    );
}

यहाँ मेरे कंपोनेंटडिडमाउंट () के अंदर क्या है जहाँ मैं एक्सियोस जीईटी अनुरोध चलाता हूं, और फिर वैकल्पिक परम की भी जांच करता हूं और इसे स्थानीय स्टोरेज में संग्रहीत करता हूं।

componentDidMount() {
    if (this.props.match.params.user) {
        this.props.getProfileByUserId(this.props.match.params.user);
    }

    if (this.props.match.params.referrer) {
        let referrerString = this.props.match.params.referrer.split('=');
        localStorage.setItem('referrer', referrerString[1])
    }
}

जब मैं मार्ग लोड करता हूं, तो इसका कहना है:/प्रोफाइल/उपयोगकर्ता/20385h1058h385/ref = GET त्रुटि का परीक्षण इस प्रकार आता है: 404 नहीं मिला, और फिर कहता है कि त्रुटि है /ref=testing ठीक है अगर यह एक वैकल्पिक परम है और मैं ' मैं वास्तव में इस वैकल्पिक परम पर जीईटी का अनुरोध नहीं कर रहा हूं, यह क्यों आ रहा है?

हर प्रकार की सहायता का स्वागत है, धन्यवाद!

2
Buckyx55 13 सितंबर 2019, 15:33

2 जवाब

सबसे बढ़िया उत्तर

मैं इसे एक प्रतिक्रिया वैकल्पिक परम मार्ग के साथ काम नहीं कर सका, इसलिए मैंने अभी आगे बढ़कर एक नया URLSearchParams() किया, इसे एक स्ट्रिंग में बनाया और फिर वास्तविक खोज क्वेरी की पहचान करने के लिए उस स्ट्रिंग को विभाजित कर दिया। स्लैश पथ पर काम करता है जैसे: /?src=testing और जब इसे मौजूदा पथ में जोड़ा जाता है।

यहाँ मैं क्या लेकर आया हूँ:

if (this.props.location.search) {
        // Check to see if the search address has a location and search query param, if so save in localStorage for referrer source
        //console.log(this.props.location.search);
        let srcParams = new URLSearchParams(this.props.location.search);
        let srcString = srcParams.toString();
        let referrerString = srcString.split('=');
        localStorage.setItem('referrer', referrerString[1]);
    }
0
Buckyx55 14 सितंबर 2019, 05:05

कृपया URL में ref=testing के बजाय केवल testing संलग्न करें। उस स्थिति में, आपका URL /profile/user/20385h1058h385/testing होगा

हम आवश्यक पैरामीटर के लिए : और वैकल्पिक पैरामीटर के लिए :parameter_name? डालते हैं।

उदाहरण के लिए :

<Route path="/login/:p1/:p2?" component={Login} />

यहाँ p1 आवश्यक पैरामीटर है और p2 एक वैकल्पिक पैरामीटर है।

और हम इन्हें कंपोनेंटडिडमाउंट विधि में प्राप्त करते हैं जैसा आप कर रहे हैं।

this.props.match.params.p1
0
Alok Mali 13 सितंबर 2019, 17:10