DataType
/
omi
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

omi v1.1.0 - support Omi.createStore

This commit is contained in:
dntzhang 2017-03-23 18:31:46 +08:00
parent dbd71cb6d1
commit 34d4212abb
13 changed files with 288 additions and 118 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
README.md
View File

@ -65,10 +65,10 @@ $ npm install omi
## CDN
* [https://unpkg.com/omi@1.0.6/dist/omi.min.js](https://unpkg.com/omi@1.0.6/dist/omi.min.js)
* [https://unpkg.com/omi@1.0.6/dist/omi.js](https://unpkg.com/omi@1.0.6/dist/omi.js)
* [https://unpkg.com/omi@1.0.6/dist/omi.lite.min.js](https://unpkg.com/omi@1.0.6/dist/omi.lite.min.js)
* [https://unpkg.com/omi@1.0.6/dist/omi.lite.js](https://unpkg.com/omi@1.0.6/dist/omi.lite.js)
* [https://unpkg.com/omi@1.1.0/dist/omi.min.js](https://unpkg.com/omi@1.1.0/dist/omi.min.js)
* [https://unpkg.com/omi@1.1.0/dist/omi.js](https://unpkg.com/omi@1.1.0/dist/omi.js)
* [https://unpkg.com/omi@1.1.0/dist/omi.lite.min.js](https://unpkg.com/omi@1.1.0/dist/omi.lite.min.js)
* [https://unpkg.com/omi@1.1.0/dist/omi.lite.js](https://unpkg.com/omi@1.1.0/dist/omi.lite.js)
## 感谢
@ -128,10 +128,10 @@ if using 'omi.lite.js' (without [mustache.js](https://github.com/janl/mustache.j
## CDN
* [https://unpkg.com/omi@1.0.6/dist/omi.min.js](https://unpkg.com/omi@1.0.6/dist/omi.min.js)
* [https://unpkg.com/omi@1.0.6/dist/omi.js](https://unpkg.com/omi@1.0.6/dist/omi.js)
* [https://unpkg.com/omi@1.0.6/dist/omi.lite.min.js](https://unpkg.com/omi@1.0.6/dist/omi.lite.min.js)
* [https://unpkg.com/omi@1.0.6/dist/omi.lite.js](https://unpkg.com/omi@1.0.6/dist/omi.lite.js)
* [https://unpkg.com/omi@1.1.0/dist/omi.min.js](https://unpkg.com/omi@1.1.0/dist/omi.min.js)
* [https://unpkg.com/omi@1.1.0/dist/omi.js](https://unpkg.com/omi@1.1.0/dist/omi.js)
* [https://unpkg.com/omi@1.1.0/dist/omi.lite.min.js](https://unpkg.com/omi@1.1.0/dist/omi.lite.min.js)
* [https://unpkg.com/omi@1.1.0/dist/omi.lite.js](https://unpkg.com/omi@1.1.0/dist/omi.lite.js)
## Thanks

21
dist/omi.js vendored
View File

@ -1,5 +1,5 @@
/*!
* Omi v1.0.6 By dntzhang
* Omi v1.1.0 By dntzhang
* Github: https://github.com/AlloyTeam/omi
* MIT Licensed.
*/
@ -269,6 +269,25 @@ return /******/ (function(modules) { // webpackBootstrap
return Omi.componetConstructor[tagName];
};
Omi.createStore = function (option) {
var Store = function (parent) {
_inherits(Obj, parent);
function Obj(data, isReady) {
_classCallCheck(this, Obj);
this.data = data;
return _possibleConstructorReturn(this, (Obj.__proto__ || Object.getPrototypeOf(Obj)).call(this, data, isReady));
}
_createClass(Obj, toArr(option.methods));
return Obj;
}(Omi.Store);
return new Store(option.data, true);
};
Omi.mixIndex = function (array, key) {
var len = array.length,
indexName = key || "index";

21
dist/omi.lite.js vendored
View File

@ -1,5 +1,5 @@
/*!
* Omi v1.0.6 By dntzhang
* Omi v1.1.0 By dntzhang
* Github: https://github.com/AlloyTeam/omi
* MIT Licensed.
*/
@ -268,6 +268,25 @@ return /******/ (function(modules) { // webpackBootstrap
return Omi.componetConstructor[tagName];
};
Omi.createStore = function (option) {
var Store = function (parent) {
_inherits(Obj, parent);
function Obj(data, isReady) {
_classCallCheck(this, Obj);
this.data = data;
return _possibleConstructorReturn(this, (Obj.__proto__ || Object.getPrototypeOf(Obj)).call(this, data, isReady));
}
_createClass(Obj, toArr(option.methods));
return Obj;
}(Omi.Store);
return new Store(option.data, true);
};
Omi.mixIndex = function (array, key) {
var len = array.length,
indexName = key || "index";

4
dist/omi.lite.min.js vendored
View File

File diff suppressed because one or more lines are too long

6
dist/omi.min.js vendored
View File

File diff suppressed because one or more lines are too long

68
example/es5/store.html Normal file
View File

@ -0,0 +1,68 @@
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="test"></div>
<a href="https://github.com/AlloyTeam/omi" target="_blank" style="position: absolute; right: 0; top: 0;">
<img src="../../asset/github.png" alt="" />
</a>
<!--[if lt IE 9]><script type="text/javascript" crossorigin="anonymous" src="//s.url.cn/qqun/xiaoqu/buluo/p/js/es5-sham-es5-sham.min.77c4325f.js"></script><![endif]-->
<script src="../../dist/omi.js"></script>
<script>
var Todo = Omi.create("Todo",{
install:function(){
this.data = this.$store.data
this.$store.addView(this);
},
add :function(evt) {
evt.preventDefault();
var text = this.data.text;
this.data.text = '';
this.$store.add(text);
},
changeHandler:function(evt){
this.data.text = evt.target.value
},
style:function () {
return 'h3 { color:red; }\
button{ color:green;}';
},
render:function(){
return '<div>\
<h3>TODO</h3>\
<ul> {{#items}} <li>{{.}}</li> {{/items}}</ul>\
<form onsubmit="add(event)" >\
<input onchange="changeHandler" type="text" value="{{text}}" />\
<button>Add #{{items.length}}</button>\
</form>\
</div>';
}
})
var store = Omi.createStore({
data: {
items: ['abc', 'def', 'ghi']
},
methods: {
add: function (value) {
this.data.items.push(value);
this.update();
},
clear: function () {
this.data.items.length = 0;
}
}
})
Omi.render(new Todo(),'#test',{
store:store
});
</script>
</body>
</html>

74
example/es5/todo_nest_store.html Normal file
View File

@ -0,0 +1,74 @@
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<a href="https://github.com/AlloyTeam/omi" target="_blank" style="position: absolute; right: 0; top: 0;">
<img src="../../asset/github.png" alt="" />
</a>
<script src="../../dist/omi.js"></script>
<script>
var Todo = Omi.create("Todo",{
install:function(){
this.$store.addView(this);
},
beforeRender:function(){
this.data.length = this.$store.data.items.length;
},
add :function(evt) {
evt.preventDefault();
var text = this.data.text;
this.data.text = ''
this.$store.add(text)
},
style:function () {
return 'h3 { color:red; }\
button{ color:green;}';
},
changeHandler:function(evt){
this.data.text = evt.target.value
},
render:function(){
return '<div>\
<h3>TODO</h3>\
<List data="$store.data" />\
<form onsubmit="add" >\
<input onchange="changeHandler" ref="textBox" type="text" />\
<button>Add #{{length}}</button>\
</form>\
</div>';
}
})
var List = Omi.create("List",{
render :function() {
return '<ul> {{#items}} <li>{{.}}</li> {{/items}}</ul>';
}
})
var store = Omi.createStore({
data: {
items: ['dntzhang', 'Omi', 'AlloyTeam']
},
methods: {
add: function (value) {
this.data.items.push(value);
this.update();
},
clear: function () {
this.data.items.length = 0;
}
}
})
Omi.render(new Todo(),'body',{
store:store
});
</script>
</body>
</html>

99
example/todo-store/bundler.js
View File

@ -364,6 +364,25 @@
return Omi.componetConstructor[tagName];
};
Omi.createStore = function (option) {
var Store = function (parent) {
_inherits(Obj, parent);
function Obj(data, isReady) {
_classCallCheck(this, Obj);
this.data = data;
return _possibleConstructorReturn(this, (Obj.__proto__ || Object.getPrototypeOf(Obj)).call(this, data, isReady));
}
_createClass(Obj, toArr(option.methods));
return Obj;
}(Omi.Store);
return new Store(option.data, true);
};
Omi.mixIndex = function (array, key) {
var len = array.length,
indexName = key || "index";
@ -2902,87 +2921,31 @@
/***/ },
/* 12 */
/***/ function(module, exports, __webpack_require__) {
/***/ function(module, exports) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
var _todoStore = __webpack_require__(13);
var _todoStore2 = _interopRequireDefault(_todoStore);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
var todoStore = new _todoStore2["default"]({
items: ["omi", "store"]
}, true);
exports["default"] = todoStore;
/***/ },
/* 13 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _index = __webpack_require__(2);
var _index2 = _interopRequireDefault(_index);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var TodoStore = function (_Omi$Store) {
_inherits(TodoStore, _Omi$Store);
function TodoStore(data, isReady) {
_classCallCheck(this, TodoStore);
var _this = _possibleConstructorReturn(this, (TodoStore.__proto__ || Object.getPrototypeOf(TodoStore)).call(this, isReady));
_this.data = Object.assign({
items: [],
length: 0
}, data);
_this.data.length = _this.data.items.length;
return _this;
}
_createClass(TodoStore, [{
key: 'add',
value: function add(value) {
exports["default"] = Omi.createStore({
data: {
items: ["omi", "store"]
},
methods: {
add: function add(value) {
this.data.items.push(value);
this.data.length = this.data.items.length;
this.update();
}
}, {
key: 'clear',
value: function clear() {
},
clear: function clear() {
this.data.items.length = 0;
this.data.length = 0;
this.update();
}
}]);
return TodoStore;
}(_index2['default'].Store);
exports['default'] = TodoStore;
}
});
/***/ }
/******/ ]);

23
example/todo-store/store.js
View File

@ -1,7 +1,18 @@
import TodoStore from './todo-store.js';
export default Omi.createStore({
data: {
items: ["omi", "store"]
},
methods: {
add: function (value) {
this.data.items.push(value)
this.data.length = this.data.items.length
this.update()
},
let todoStore = new TodoStore({
items: ["omi","store"]
},true)
export default todoStore;
clear: function () {
this.data.items.length = 0
this.data.length = 0
this.update()
}
}
});

28
example/todo-store/todo-store.js
View File

@ -1,28 +0,0 @@
import Omi from '../../src/index.js';
class TodoStore extends Omi.Store {
constructor(data , isReady) {
super(isReady)
this.data = Object.assign({
items:[],
length:0
},data)
this.data.length = this.data.items.length
}
add(value){
this.data.items.push(value)
this.data.length = this.data.items.length
this.update()
}
clear(){
this.data.items.length = 0
this.data.length = 0
this.update()
}
}
export default TodoStore

2
package.json
View File

@ -1,6 +1,6 @@
{
"name": "omi",
"version": "1.0.6",
"version": "1.1.0",
"description": "Open and modern framework for building user interfaces.",
"main": "dist/omi.js",
"scripts": {

19
src/omi.js
View File

@ -145,6 +145,25 @@ Omi.create = function(tagName ,parent,setting) {
return Omi.componetConstructor[tagName]
}
Omi.createStore = function(option) {
let Store = function (parent) {
_inherits(Obj, parent)
function Obj(data, isReady) {
_classCallCheck(this, Obj)
this.data = data
return _possibleConstructorReturn(this, (Obj.__proto__ || Object.getPrototypeOf(Obj)).call(this, data, isReady))
}
_createClass(Obj, toArr(option.methods))
return Obj
}(Omi.Store)
return new Store(option.data, true)
}
Omi.mixIndex = function(array, key) {
const len = array.length,
indexName = key || "index"

25
tutorial/store.md
View File

@ -290,6 +290,31 @@ class Todo extends Omi.Component {
可以看到上面的add方法可以通过this.$store.isReady获取组件store是否准备就绪。
## 补充（20170323）
在omi v1.1.0及以后的版本中，已经支持Omi.createStore快捷创建store。如:
```js
export default Omi.createStore({
data: {
items: ["omi", "store"]
},
methods: {
add: function (value) {
this.data.items.push(value)
this.data.length = this.data.items.length
this.update()
},
clear: function () {
this.data.items.length = 0
this.data.length = 0
this.update()
}
}
});
```
## 源码地址
* 更为详细的代码可以[点击这里](https://github.com/AlloyTeam/omi/tree/master/example/todo-store)