修复异步路由加载逻辑; 优化router-link组件的赋值

master 1.3.9
yutent 2024-05-11 15:20:34 +08:00
parent 37dcc51e05
commit d3a00a319f
3 changed files with 27 additions and 17 deletions

View File

@ -1,6 +1,6 @@
{
"name": "wkitd",
"version": "1.3.8",
"version": "1.3.9",
"type": "module",
"main": "dist/index.js",
"files": [

View File

@ -1,6 +1,6 @@
//
import { Component, html, css, raw } from 'wkit'
import { object2query } from '../utils.js'
import { object2query, query2object } from '../utils.js'
import { __ROUTER_VIEW__, ROUTE_CALLBACKS } from '../constants.js'
import { watch } from '../store.js'
@ -93,7 +93,7 @@ class RouterView extends Component {
class RouterLink extends Component {
static props = {
to: Object,
to: { type: null },
disabled: false
}
@ -120,11 +120,12 @@ class RouterLink extends Component {
cursor: not-allowed;
}
`
#to = { path: '' }
#href = ''
#navigate() {
let type = this.$router.type
let { path } = this.to
if (this.disabled) {
return
}
@ -132,26 +133,33 @@ class RouterLink extends Component {
if (type === 'hash') {
location.hash = this.#href
} else {
this.$router.push(this.to)
this.$router.push(this.#to)
}
}
#parsePath() {
let type = this.$router.type
let { path = '', query = {} } = this.to
let params =
typeof query === 'string'
? query.replaceAll('?', '')
: object2query(query)
let path, query, params
if (typeof this.to === 'string') {
let tmp = this.to.split('?')
path = tmp[0]
params = tmp[1] || ''
query = query2object(params)
} else {
path = this.to.path || ''
query = this.to.query || {}
params =
typeof query === 'string'
? query.replaceAll('?', '')
: object2query(query)
}
path = '/' + path.replace(/^\/+/, '')
this.to = { path, query }
this.#to = { path, query }
if (params) {
path += '?' + params
}
return path
this.#href = path
}
activated() {
@ -166,7 +174,7 @@ class RouterLink extends Component {
if (this.removed) {
return
}
this.classList.toggle('active', route.path === this.to.path)
this.classList.toggle('active', route.path === this.#to.path)
})
}
@ -175,7 +183,7 @@ class RouterLink extends Component {
}
render() {
this.#href = this.#parsePath()
this.#parsePath()
return html`<a title=${this.#href} @click=${this.#navigate}
><slot></slot
></a>`

View File

@ -129,6 +129,7 @@ class Router {
params,
query: query2object(query)
}
Object.defineProperty(next, 'raw', { value: route.path })
if (this.#beforeEach) {
return this.#beforeEach(this.route, next, () => {
this.#exec(next)
@ -152,7 +153,7 @@ class Router {
#exec(route) {
let $view = window.wkitd.get(__ROUTER_VIEW__)
let table = this.#tables.get(route.path)
let table = this.#tables.get(route.raw)
$view.current = route.name
this.#route = route
@ -228,6 +229,7 @@ class Router {
return
}
// 缓存当前路由信息, 当没有匹配到正确的路由时, 回调此缓存
this.#tmp = obj
if (this.type === MODE_HASH) {