去除路由器中的查询项
P粉005134685
P粉005134685 2023-08-25 22:53:17
[Vue.js讨论组]
<p>我正在使用Vue中的<code>replace</code>方法将<code>query</code>添加到当前URL中。 如果值不存在,我将其赋值为<code>undefined</code>。</p> <pre class="brush:js;toolbar:false;">this.$router.replace({ name: &quot;admin-frs&quot;, 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>
P粉005134685
P粉005134685

全部回复(1)
P粉982009874

如果我理解正确,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("&");
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号