update store tutorial
This commit is contained in:
parent
91897b2f45
commit
bd8557782b
File diff suppressed because it is too large
Load Diff
|
@ -2,15 +2,14 @@ import Omi from '../../src/index.js';
|
|||
import Pagination from './pagination.js';
|
||||
import Content from './content.js';
|
||||
|
||||
Omi.makeHTML('Pagination', Pagination);
|
||||
Omi.makeHTML('Content', Content);
|
||||
Omi.tag('pagination', Pagination);
|
||||
Omi.tag('content', Content);
|
||||
|
||||
class Main extends Omi.Component {
|
||||
constructor(data) {
|
||||
super(data);
|
||||
}
|
||||
|
||||
|
||||
handlePageChange(index){
|
||||
this.content.goto(index+1)
|
||||
this.update()
|
||||
|
@ -19,14 +18,14 @@ class Main extends Omi.Component {
|
|||
render () {
|
||||
return `<div>
|
||||
<h1>Pagination Example</h1>
|
||||
<Content name="content" />
|
||||
<Pagination
|
||||
<content name="content" ></content>
|
||||
<pagination
|
||||
name="pagination"
|
||||
:data-total="100"
|
||||
:data-page-size="10"
|
||||
:data-num-edge="1"
|
||||
:data-num-display="4"
|
||||
onPageChange="handlePageChange" />
|
||||
:data-num-display="4"
|
||||
onpagechange="handlePageChange" ></pagination>
|
||||
</div>`;
|
||||
}
|
||||
}
|
|
@ -14,7 +14,7 @@ class Pagination extends Omi.Component {
|
|||
ellipseText: "...",
|
||||
prevShow: true,
|
||||
nextShow: true,
|
||||
onPageChange: function () { return false; }
|
||||
onpagechange: function () { return false; }
|
||||
}, data);
|
||||
super(data);
|
||||
}
|
||||
|
@ -26,8 +26,7 @@ class Pagination extends Omi.Component {
|
|||
goto (index,evt) {
|
||||
evt.preventDefault();
|
||||
this.data.currentPage=index;
|
||||
this.update();
|
||||
this.data.onPageChange(index);
|
||||
this.data.onpagechange(index);
|
||||
}
|
||||
|
||||
style(){
|
|
@ -28,7 +28,7 @@ class Main extends Omi.Component {
|
|||
render () {
|
||||
return `<div>
|
||||
<h1>Pagination Example</h1>
|
||||
<Content name="content" />
|
||||
<content name="content"></content>
|
||||
<pagination
|
||||
name="pagination"
|
||||
:data-total="100"
|
||||
|
@ -351,6 +351,4 @@ Omi Store体系以前通过addView进行视图收集,store进行update的时
|
|||
* Omi相关的使用教程和blog,可以访问 [Omi Tutorial](https://github.com/AlloyTeam/omi/tree/master/tutorial)
|
||||
* 如果你懒得搭建项目脚手架,可以试试 [omi-cli](https://github.com/AlloyTeam/omi/tree/master/cli)
|
||||
* 如果你有Omi相关的问题可以 [New issue](https://github.com/AlloyTeam/omi/issues/new)
|
||||
* 如果想更加方便的交流关于Omi的一切可以加入QQ的Omi交流群(256426170)
|
||||
|
||||

|
||||
* 如果想更加方便的交流关于Omi的一切可以加入QQ的Omi交流群(256426170)
|
Loading…
Reference in New Issue