GSearch - UI (英语)
执行简单用户界面的网络组件 银河系。 。 。 .
演示
演示页面 : https://sdfidk.github.io/gsearch-ui/ 页面存档备份,存于互联网档案馆
安装
无
$ npm i @dataforsyningen/gsearch-ui -S
使用量
要使用 GSearch-UI 您必须首先创建用户 https://dataforsyningen.dk/ 页面存档备份,存于互联网档案馆 并创造一种迹象.
然后您可以在下面的例子中使用 GSearch-UI .
<main>
<g-search data-token="INSERTYOURTOKENHERE"></g-search>
</main>
<script type="module">
import { GSearchUI } from '@dataforsyningen/gsearch-ui'
customElements.define('g-search', GSearchUI)
document.querySelector("g-search").addEventListener('gsearch:select', (event) => {
// handle the click here
// event.detail contains the result object
})
</script>
数据属性
GSearch-UI使用html数据属性配置.
| 属性名称 | 说明 | 所需经费 | 动态更新 | 默认 |
|---|---|---|---|---|
data-token | 有效的符号来源 https://dataforsyningen.dk/ 页面存档备份,存于互联网档案馆 | 对 | 对 | NaN |
data-resources | 应当搜索的资源。 更多信息见 GSearch 文档 | 没有 | 对 | navngivenvej,husnummer,adresse,stednavn,kommune,region,retskreds,postnummer,opstillingskreds,sogn,politikreds,matrikel,matrikel_udgaaet |
resource-filter-enabled | 显示选定资源的过滤按钮,以便用户切换资源. | 没有 | 对 | false |
data-limit | 显示每个资源的匹配次数 。 最大值为100. | 没有 | 对 | 10 |
data-placeholder | 输入字段中要显示的占位符文本 . | 没有 | 对 | søg... |
data-api | 对 GSearch API 使用自定义的 URL( 即如果您想要使用测试 API) | 没有 | 对 | https://api.dataforsyningen.dk/rest/gsearch/v2.0/ |
data-filter | 在搜索查询中使用自定义过滤器. 在 GSearch 文件中学习过滤器. | 没有 | 没有 | none |
data-srid | 归来几何的坐标系统. 允许的值有:2196,2197,2198,3857,4093,4094,4095,4096,4326,25832,25833. | 没有 | 对 | 25832 |
点击事件
当点击在 GSearch-UI 中显示的结果时, 它会发送一个自定义事件, gsearch:select,其中包含结果对象。 细节。 对象的结构取决于资源. 请参看关于不同语句的更多信息: https://github.com/SDFIDk/gsearch/tree/v2.0/doc 页面存档备份,存于互联网档案馆。 。 。 .
单击十字以清除输入字段点出自定义事件, gsearch:clear。 。 。 .
公布国家预防机制
在Github创建新的发行版,发布更新的国家预防机制软件包. 详见SDFI ITU维基百科"Npm"一栏.
鸣谢
根据麻省理工学院的许可证提供GSearch-UI 用于 Dataforsyning og Infrastruktur 的 Styrelsen @ SDFI 软件服务