https://github.com/ipluser/plover-xview
对plover模块页面进行标识和包装。
https://github.com/ipluser/plover-xview
Last synced: 3 months ago
JSON representation
对plover模块页面进行标识和包装。
- Host: GitHub
- URL: https://github.com/ipluser/plover-xview
- Owner: ipluser
- Created: 2016-06-17T14:42:37.000Z (almost 9 years ago)
- Default Branch: master
- Last Pushed: 2016-07-20T12:47:14.000Z (almost 9 years ago)
- Last Synced: 2025-01-14T12:51:33.760Z (5 months ago)
- Language: JavaScript
- Homepage:
- Size: 6.84 KB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
Awesome Lists containing this project
README
# xview
[![NPM version][npm-image]][npm-url]
[![build status][travis-image]][travis-url]
[![Test coverage][coveralls-image]][coveralls-url]
对模块页面进行标识和包装。
e.g.
模块名称为**Hello**，Action名称为**view**，页面内容为：
```html
hello world~
```
通过**plover-xview**处理后，页面渲染结果：
```html
hello world~
```
**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
```html
{{$.addClass('testClassName')}}
hello world~
```
处理后的模块页面内容：
```html
hello world~
```
### attr
为**xview**添加属性。
##### usage
```js
{{$.attr('attr1', 'value1')}}
{{$.attr({ attr2: 'value2', attr3: 'value3' })}}
hello world~
```
处理后的模块页面内容：
```html
hello world~
```
##### viewdata
后端传递数据到前端。
##### usage
```js
{{$.viewdata('name', 'plover')}}
hello world~
```
处理后的模块页面内容：
```html
hello world~
```
### metaTags
为页面添加`meta`标签，格式为:
```html
```
##### usage
```js
{{$.metaTags({viewdata: true})}}
```
[npm-image]: https://img.shields.io/npm/v/plover-xview.svg?style=flat-square
[npm-url]: https://www.npmjs.com/package/plover-xview
[travis-image]: https://img.shields.io/travis/plover-modules/plover-xview/master.svg?style=flat-square
[travis-url]: https://travis-ci.org/plover-modules/plover-xview
[coveralls-image]: https://img.shields.io/codecov/c/github/plover-modules/plover-xview.svg?style=flat-square
[coveralls-url]: https://codecov.io/github/plover-modules/plover-xview?branch=master