聚合物app-route查询字符串格式

时间:2017-07-28 17:38:17

标签: polymer polymer-1.0

我在app-locationapp-route的应用程序中替换了PageJS路由,除了查询参数之外,一切似乎都有效。我注意到它只能读取像host?param1=val1#/view这样的网址,而不是host#view?param1=val1 PageJS以前的网址。

进一步挖掘后,我发现这实际上是RFC standard。我发现PageJS和Angular可以使用非标准查询字符串格式很奇怪。

有没有办法使用query-params的{​​{1}}属性来读取非标准查询参数以实现向后兼容?

1 个答案:

答案 0 :(得分:1)

非标准表单适用于PageJS,因为PageJS通过extracting the text that follows ?然后parsing that for any hashes that need to be separated out手动解析URL中的查询字符串。 Angular可能会做类似的事情。另一方面,$data = Modelname::whereNotIn('id', [1, 2, 3])->take(1)->get(); (和<app-location>)使用平台的window.location.search来获取查询参数。

如果您需要坚持使用<iron-location>,则可以通过猴子修补<iron-location>._urlChanged()添加向后兼容支持,该修补程序负责解析<iron-location>的网址。

Monkey-patched <app-location>

<app-location>

或者,您可以切换到支持以开箱即用的形式解析查询参数的Polymer元素。我建议<nebula-location>(使用QS作为查询字符串解析器)。

Polymer({ is: 'my-app', ready: function() { this._setupAppLocation(); }, _setupAppLocation: function() { // assumes <app-location id="location"> const ironLocation = this.$.location.$$('iron-location'); if (!ironLocation) return; ironLocation._urlChanged = function() { this._dontUpdateUrl = true; this.path = window.decodeURIComponent(window.location.pathname); if (window.location.hash.includes('?')) { const parts = window.location.hash.split('?'); this.hash = window.decodeURIComponent(parts[0].slice(1)); this.query = parts[1]; // Prepend other query parameters found in standard location if (window.location.search) { this.query = window.location.search.substring(1) + '&' + this.query; } } else { this.query = window.location.search.substring(1); } this._dontUpdateUrl = false; this._updateUrl(); }; } }); 的示例用法:

<nebula-location>