diff --git a/packages/rax-simulator-renderer/src/renderer.ts b/packages/rax-simulator-renderer/src/renderer.ts index 8a9de7996..e3fb20c11 100644 --- a/packages/rax-simulator-renderer/src/renderer.ts +++ b/packages/rax-simulator-renderer/src/renderer.ts @@ -5,6 +5,8 @@ import { computed, obx } from '@recore/obx'; import DriverUniversal from 'driver-universal'; import { EventEmitter } from 'events'; // @ts-ignore +import { createMemoryHistory, MemoryHistory } from 'history'; +// @ts-ignore import { ComponentType, createElement, render as raxRender, shared } from 'rax'; import Leaf from './builtin-components/leaf'; import Slot from './builtin-components/slot'; @@ -13,9 +15,7 @@ import SimulatorRendererView from './renderer-view'; import { raxFindDOMNodes } from './utils/find-dom-nodes'; import { getClientRects } from './utils/get-client-rects'; import loader from './utils/loader'; -// @ts-ignore -// import { createMemoryHistory, MemoryHistory } from 'history/umd/history.development'; -import { createMemoryHistory, MemoryHistory } from 'history'; +import { parseQuery, withQueryParams } from './utils/url'; const { Instance } = shared; @@ -289,16 +289,16 @@ export class SimulatorRendererContainer implements BuiltinSimulatorRenderer { utils: { router: { push(path: string, params?: object) { - // history.push(withQueryParams(path, params)); + history.push(withQueryParams(path, params)); }, replace(path: string, params?: object) { - // history.replace(withQueryParams(path, params)); + history.replace(withQueryParams(path, params)); }, }, legaoBuiltins: { getUrlParams() { const search = history.location.search; - // return parseQuery(search); + return parseQuery(search); } } }, diff --git a/packages/rax-simulator-renderer/src/utils/url.ts b/packages/rax-simulator-renderer/src/utils/url.ts new file mode 100644 index 000000000..d720323b3 --- /dev/null +++ b/packages/rax-simulator-renderer/src/utils/url.ts @@ -0,0 +1,74 @@ +/** + * Parse queryString + * @param {String} str '?q=query&b=test' + * @return {Object} + */ +export function parseQuery(str: string): object { + const ret: any = {}; + + if (typeof str !== 'string') { + return ret; + } + + const s = str.trim().replace(/^(\?|#|&)/, ''); + + if (!s) { + return ret; + } + + s.split('&').forEach((param) => { + const parts = param.replace(/\+/g, ' ').split('='); + let key = parts.shift()!; + let val: any = parts.length > 0 ? parts.join('=') : undefined; + + key = decodeURIComponent(key); + + val = val === undefined ? null : decodeURIComponent(val); + + if (ret[key] === undefined) { + ret[key] = val; + } else if (Array.isArray(ret[key])) { + ret[key].push(val); + } else { + ret[key] = [ret[key], val]; + } + }); + + return ret; +} + +/** + * Stringify object to query parammeters + * @param {Object} obj + * @return {String} + */ +export function stringifyQuery(obj: any): string { + const param: string[] = []; + Object.keys(obj).forEach((key) => { + let value = obj[key]; + if (value && typeof value === 'object') { + value = JSON.stringify(value); + } + param.push(`${encodeURIComponent(key)}=${encodeURIComponent(value)}`); + }); + return param.join('&'); +} + +export function uriEncode(uri: string) { + return encodeURIComponent(uri); +} + +export function uriDecode(uri: string) { + return decodeURIComponent(uri); +} + +export function withQueryParams(url: string, params?: object) { + const queryStr = params ? stringifyQuery(params) : ''; + if (queryStr === '') { + return url; + } + const urlSplit = url.split('#'); + const hash = urlSplit[1] ? `#${urlSplit[1]}` : ''; + const urlWithoutHash = urlSplit[0]; + return `${urlWithoutHash}${~urlWithoutHash.indexOf('?') ? '&' : '?'}${queryStr}${hash}`; +}