移除路由器中的查詢項
P粉005134685
2023-08-25 22:53:17
<p>我正在使用Vue中的<code>replace</code>方法將<code>query</code>新增至目前URL。
如果值不存在，我將其賦值為<code>undefined</code>。 </p>
<pre class="brush:js;toolbar:false;">this.$router.replace({
name: "admin-frs",
query: {
limit: this.pageSize,
page: this.currentPage,
sort: this.sortbyapi || undefined,
language: this.sortbyapiLang || undefined,
},
})
</pre>
<p>當查詢資料更新時，這將使查詢項目從URL中消失，這是可以接受的。 </p>
<p>但它不會從查詢物件中刪除它。 </p>
<p>有沒有比這更好的方法呢？ </p>
<p>此外，是否可能從路由中取得查詢項，就像<code>&limit=10...etc</code>這樣？ </p>
如果我理解正確，OP希望操作傳遞給
router.replace的查詢物件。可以使用標準的js來實作。首先，明確命名一個查詢變數...
要刪除某個屬性，可以使用js的delete運算子。例如，要刪除query.limit...
或者，如果你正在建立該查詢，可以一開始就不加入limit屬性...
let query = {}; if (this.pageSize) query.limit = this.pageSize; if (this.currentPage) query.page = this.currentPage; // 其他属性也是类似的处理 // query现在只包含上述选择的属性進行任何這些操作後，將變數傳遞給路由器...
$router.replace({ name: "admin-frs", query });要將其轉換為字串，可能有幾種方法，包括許多您可能擁有的庫中的方法，但原生的方法是...
let params = []; for (let key in query) params.push(`${encodeURIComponent(key)}=${encodeURIComponent(query[key])}`); const queryString = params.join("&");