Abfrageelemente vom Router entfernen

Question

Ich verwende die Methode replace, um query hinzuzufügen. Wenn der Wert nicht existiert, weise ich ihn als undefiniert zu.

this.$router.replace({
  Name: "admin-frs",
  Abfrage: {
    Grenze: this.pageSize,
    Seite: this.currentPage,
    Sortieren: this.sortbyapi ||.
    Sprache: this.sortbyapiLang || undefiniert,
  },
})

Dies führt dazu, dass die Abfrageelemente aus der URL verschwinden, wenn die Abfragedaten aktualisiert werden, was akzeptabel ist.

Aber es wird nicht aus dem Abfrageobjekt entfernt.

Gibt es einen besseren Weg als diesen?

Ist es außerdem möglich, die Abfrageelemente aus der Route abzurufen, wie &limit=10...etc?

Answer 1

如果我理解正确，OP希望操作传递给router.replace的查询对象。可以使用标准的js来实现。

首先，明确命名一个查询变量...

let query = $router.query;

要删除某个属性，可以使用js的delete运算符。例如，要删除query.limit...

// 删除limit属性
if (!this.pageSize) 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("&");