react.js - Bagaimana untuk menggunakan ruang letak untuk mentakrifkan URL yang tenang dalam javascript Saya tahu tentang sudut, tetapi pustaka mana yang harus saya gunakan semasa menggunakan react?

Question

Saya tahu begini keadaannya dalam sudut

$resource('http://localhost:8080/web/user/:id/oper/:active',{id: '111',active: 'y'})

Apa yang digunakan dalam bertindak balas? Adakah terdapat pakej yang boleh mencapai fungsi ini?

Answer 1

Saya menggunakan borang http://localhost:8080/web/user/{id}/oper/{active}, yang sama dengan bentuk URL latar belakang SpringMvc Kaedah penggantian rentetan menggunakan fungsi berikut

/**
 * 扩展了 String 类型，给其添加格式化的功能，替换字符串中 {placeholder} 或者 {0}, {1} 等模式部分为参数中传入的字符串
 * 使用方法:
 *     'I can speak {language} since I was {age}'.format({language: 'Javascript', age: 10})
 *     'I can speak {0} since I was {1}'.format('Javascript', 10)
 * 输出都为:
 *     I can speak Javascript since I was 10
 *
 * @param replacements 用来替换 placeholder 的 JSON 对象或者数组
 */
String.prototype.format = function(replacements) {
    replacements = (typeof replacements === 'object') ? replacements : Array.prototype.slice.call(arguments, 0);
    return formatString(this, replacements);
}
/**
 * 替换字符串中 {placeholder} 或者 {0}, {1} 等模式部分为参数中传入的字符串
 * 使用方法:
 *     formatString('I can speak {language} since I was {age}', {language: 'Javascript', age: 10})
 *     formatString('I can speak {0} since I was {1}', 'Javascript', 10)
 * 输出都为:
 *     I can speak Javascript since I was 10
 *
 * @param str 带有 placeholder 的字符串
 * @param replacements 用来替换 placeholder 的 JSON 对象或者数组
 */
var formatString = function (str, replacements) {
    replacements = (typeof replacements === 'object') ? replacements : Array.prototype.slice.call(arguments, 1);
    return str.replace(/\{\{|\}\}|\{(\w+)\}/g, function(m, n) {
        if (m == '{{') { return '{'; }
        if (m == '}}') { return '}'; }
        return replacements[n];
    });
};

Answer 2

Saya menulis sendiri,

/**
 * 格式化url占位符
 * eg: http://localhost:8080/yunpan/{id}/aaa/{name}
 * urlFormat(url, {id: '111', name: 'yc'})
 * => http://localhost:8080/yunpan/111/aaa/yc
 *
 * @param url
 * @param param
 * @returns {*}
 */
export const urlFormat = (url, param) => {
    if (param === undefined || param === null || param === {}) {
        return url;
    }

    let keys = Object.keys(param);
    for (let key of keys) {
        url = url.replace(new RegExp("\{" + key + "\}", "g"), param[key]);
    }
    return url;
};