74 lines
2.3 KiB
HTML
74 lines
2.3 KiB
HTML
<div>
|
||
<h1>lgres</h1>
|
||
<hr />
|
||
<p>
|
||
语言资源工具类，用以设置页面以及脚本中的多语言。
|
||
</p>
|
||
<h2>r</h2>
|
||
<code>function r(key: string, defaultValue?: any): any</code>
|
||
<h3>key: string</h3>
|
||
<p>
|
||
语言资源的关键字
|
||
</p>
|
||
<h3>defaultValue?: any</h3>
|
||
<p>
|
||
资源的默认值，如无法获取该语言资源，则返回该值
|
||
</p>
|
||
<h2>lang</h2>
|
||
<code>const lang : {}</code>
|
||
<h3>get current(): string</h3>
|
||
<p>
|
||
返回当前语言 id
|
||
</p>
|
||
<h3>get unknownError(): string</h3>
|
||
<p>
|
||
未知错误的语言资源，默认为 <code>'An unknown error occurred, please contact the administrator.'</code>
|
||
</p>
|
||
<h3>get savedSuccessfully(): string</h3>
|
||
<p>
|
||
保存成功的语言资源，默认为 <code>'Saved successfully.'</code>
|
||
</p>
|
||
<h2>init</h2>
|
||
<code>function init(dom?: HTMLElement, options?: LgresOptions): Promise<LanguageResource></code>
|
||
<h3>dom?: HTMLElement</h3>
|
||
<p>
|
||
待处理的元素，为空时处理整个页面
|
||
</p>
|
||
<h3>options?: LgresOptions</h3>
|
||
<p>
|
||
初始化参数，结构为
|
||
<pre>interface LgresOptions {
|
||
template?: string,
|
||
callback?: (result: any) => void
|
||
}</pre>
|
||
</p>
|
||
<h4>template?: string</h4>
|
||
<p>
|
||
语言资源文件的后缀，资源文件 url 为 <code>`language/${lgid}${template}`</code>
|
||
</p>
|
||
<h4>callback?: (result: any) => void</h4>
|
||
<p>
|
||
资源初始化后的回调函数，可能在 DOM 加载完成之前触发。
|
||
</p>
|
||
<h3>return: Promise<LanguageResource></h3>
|
||
<p>
|
||
返回一个包含资源结果的 Promise，将在 DOM 加载完成之后触发。
|
||
</p>
|
||
<p><code>LanguageResource</code> 结构为
|
||
<pre>interface LanguageResource {
|
||
r(key: string, defaultValue?: any): any
|
||
}</pre>
|
||
</p>
|
||
<hr />
|
||
<h2>用法</h2>
|
||
<pre>const lgres = window["lib-utility"];
|
||
|
||
lgres.init(document.body, {
|
||
template: '/res.json',
|
||
callback: res => document.title = res.r('title', 'Default Title')
|
||
}).then(res => {
|
||
document.querySelector('#header').innerText = res.r('header', 'My Header');
|
||
const msg = lgres.lang.unknownError;
|
||
document.querySelector('#message').innerText = lgres.lang.unknownError;
|
||
});</pre>
|
||
</div> |