diff --git a/src/utils/tools.ts b/src/utils/tools.ts index 55d247d..cc0c999 100644 --- a/src/utils/tools.ts +++ b/src/utils/tools.ts @@ -21,7 +21,14 @@ export const url = { * @returns {Record} { x: 1, y: 2, z: 3 } */ getUrlToParams: (url: string = window.location.href): Record => { - const urlParams = new URLSearchParams(url.split('?')[1]); + /** + * 匹配?与#之间的字符串,即url后面的参数 + * 例1: http://127.0.0.1:8080/?x=1&y=2#/index + * 例2: http://127.0.0.1:8080/#/index?x=1&y=2 + * 匹配上面两种格式的url参数(主要是#号位置不同导致的判断不同) + */ + const match = url.match(/\?(.+?)(?:#|$)/); + const urlParams = new URLSearchParams(match ? match[1] : ''); const params = {}; for (const [key, value] of urlParams.entries()) { params[key] = value; diff --git a/src/views/demo/cssDemo.vue b/src/views/demo/cssDemo.vue index 71fbde9..846b55b 100644 --- a/src/views/demo/cssDemo.vue +++ b/src/views/demo/cssDemo.vue @@ -11,6 +11,12 @@
子元素3
+ + +
+
+
+ @@ -32,4 +38,25 @@ background: yellow; } } + +.input-box { + box-sizing: border-box; + position: relative; + width: 100%; + height: 70px; + padding: 15px; +} +.input { + box-sizing: border-box; + border-radius: 8px; + overflow: hidden; + display: block; + width: 100%; + height: 100%; + border: 2px solid transparent; + background: + linear-gradient(white, white) padding-box, + linear-gradient(45deg, #f6855c, #e29cf9, #5cacfe) border-box; + padding-left: 5px; +}