ipluser / plover-xview

对plover模块页面进行标识和包装。

xview

对模块页面进行标识和包装。

e.g.

模块名称为Hello，Action名称为view，页面内容为：

<p>hello world~</p>

通过plover-xview处理后，页面渲染结果：

<div class="x-view hello-view" data-x-id="hello:view" data-x-type="hello/view">
  <p>hello world~</p>
</div>

plover-xview会对模块页面使用div进行包装，为其添加x-view和moduleName-actionName默认的class，设置data-x-id属性为moduleName:actionName和data-x-type属性为moduleName/actionName。

Note

在controller中通过this.xview = false;关闭plover-xview模块的处理。

$ Helper

提供**$帮助对象方法对xview**进行扩展。

addClass

为xview添加类名。

usage

{{$.addClass('testClassName')}}

<p>hello world~</p>

处理后的模块页面内容：

<div class="x-view hello-view testClassName" data-x-id="hello:view" data-x-type="hello/view">
  <p>hello world~</p>
</div>

attr

为xview添加属性。

usage

{{$.attr('attr1', 'value1')}}
{{$.attr({ attr2: 'value2', attr3: 'value3' })}}

<p>hello world~</p>

处理后的模块页面内容：

<div class="x-view hello-view" data-x-id="hello:view" data-x-type="hello/view"
 attr1="value1" attr2="value2" attr3="value3">
  <p>hello world~</p>
</div>

viewdata

后端传递数据到前端。

usage

{{$.viewdata('name', 'plover')}}

<p>hello world~</p>

处理后的模块页面内容：

<div class="x-view hello-view" data-x-id="hello:view" data-x-type="hello/view" data-x-viewdata="{'name': 'plover'}">
  <p>hello world~</p>
</div>

metaTags

为页面添加meta标签，格式为:

<meta name="x-viewdata" content="${viewdata}" />

usage

{{$.metaTags({viewdata: true})}}