store.update supporting

examples/store/b.js

@@ -612,7 +612,8 @@
 		var update = false;
 		// add new & update changed attributes
 		for (name in attrs) {
-			if (typeof attrs[name] === 'object') {
+			//diable when using store system
+			if (!dom.store && typeof attrs[name] === 'object') {
 				// todo diff??
 				dom.props[npn(name)] = attrs[name];
 				dom.parentNode && (update = true);
@@ -647,6 +648,9 @@
 
 	    WeElement.prototype.connectedCallback = function connectedCallback() {
 	        this.store = options.store;
+	        if (this.store) {
+	            this.store.instances.push(this);
+	        }
 	        this.install();
 
 	        var shadowRoot = this.attachShadow({ mode: 'open' });
@@ -705,10 +709,23 @@
 
 	function render(vnode, parent, store) {
 		parent = typeof parent === 'string' ? document.querySelector(parent) : parent;
-		options.store = store;
+		if (store) {
+			store.instances = [];
+			extendStoreUpate(store);
+			options.store = store;
+		}
 		diff(null, vnode, {}, false, parent, false);
 	}
 
+	function extendStoreUpate(store) {
+		store.update = function () {
+			this.instances.forEach(function (instance) {
+				//diff here?
+				instance.update();
+			});
+		};
+	}
+
 	var OBJECTTYPE = '[object Object]';
 
 	function define(name, ctor) {
@@ -776,7 +793,6 @@
 	    }
 
 	    TodoList.prototype.render = function render$$1(props) {
-	        console.error(this.store);
 	        return Omi.h(
 	            'ul',
 	            null,
@@ -814,12 +830,7 @@
 	            if (!_this2.store.data.text.length) {
 	                return;
 	            }
-	            _this2.store.data.items.push({
-	                text: _this2.store.data.text,
-	                id: Date.now()
-	            });
-	            _this2.store.data.text = '';
-	            _this2.update();
+	            _this2.store.add();
 	        }, _temp), _possibleConstructorReturn$1(_this2, _ret);
 	    }
 
@@ -864,7 +875,18 @@
 
 	define('todo-app', TodoApp);
 
-	var store = { data: { items: [], text: '' } };
+	var store = {
+	    data: { items: [], text: '' },
+	    add: function add() {
+	        this.data.items.push({
+	            text: this.data.text,
+	            id: Date.now()
+	        });
+	        this.data.text = '';
+	        this.update();
+	    }
+	};
+
 	render(Omi.h('todo-app', null), 'body', store);
 
 }());

examples/store/main.js

@@ -2,7 +2,6 @@ import { render, WeElement, define } from '../../src/omi'
 
 class TodoList extends WeElement {
     render(props) {
-        console.error(this.store)
         return (
             <ul>
                 {props.items.map(item => (
@@ -49,16 +48,22 @@ class TodoApp extends WeElement {
         if (!this.store.data.text.length) {
             return;
         }
-        this.store.data.items.push({
-            text: this.store.data.text,
-            id: Date.now()
-        })
-        this.store.data.text = ''
-        this.update()
+        this.store.add()
     }
 }
 
 define('todo-app', TodoApp)
 
-const store = { data: { items: [], text: '' } }
+const store = { 
+    data: { items: [], text: '' },
+    add:function(){
+        this.data.items.push({
+            text:this.data.text,
+            id:Date.now()
+        })
+        this.data.text = ''
+        this.update()
+    }
+}
+
 render(<todo-app></todo-app>, 'body', store)

src/render.js

@@ -4,6 +4,19 @@ import options from './options'
 
 export function render(vnode, parent, store) {
 	parent = typeof parent === 'string' ? document.querySelector(parent) : parent
-	options.store = store
+	if(store){
+		store.instances = []
+		extendStoreUpate(store)
+		options.store = store	
+	}
 	diff(null, vnode, {}, false, parent, false)
 } 
+
+function extendStoreUpate(store){
+	store.update = function(){
+		this.instances.forEach(instance => {
+			//diff here?
+			instance.update()
+		})
+	}
+}

src/vdom/diff.js

@@ -287,7 +287,8 @@ function diffAttributes(dom, attrs, old) {
 	let update  = false
 	// add new & update changed attributes
 	for (name in attrs) {
-		if(typeof attrs[name] === 'object'){
+		//diable when using store system
+		if(!dom.store && typeof attrs[name] === 'object'){
 			// todo diff??
 			dom.props[npn(name)] = attrs[name]
 			dom.parentNode && (update = true)
@@ -295,6 +296,6 @@ function diffAttributes(dom, attrs, old) {
 			setAccessor(dom, name, old[name], old[name] = attrs[name], isSvgMode);
 		}
 	}
-
+	
 	update && dom.update()
 }

src/we-element.js

@@ -20,6 +20,9 @@ export default class WeElement extends HTMLElement {
 
     connectedCallback() {
         this.store = options.store
+        if(this.store){
+            this.store.instances.push(this)
+        }
         this.install()
         
         const shadowRoot = this.attachShadow({ mode: 'open' })