🐛fixed sprite3.x

Author: akira-cn

dist/sprite-vue.js

@@ -9791,7 +9791,7 @@ function createElement(tagName, vnode) {
     if (tagName === 'scene') {
       var _elm = document.createElement('div');
       if (attrs.id) _elm.id = attrs.id;
-      if (!vnode.data.ref) vnode.data.ref = 'scene';
+      if (!spritejs__WEBPACK_IMPORTED_MODULE_5__["isSpriteNode"] && !vnode.data.ref) vnode.data.ref = 'scene';
       if (!('useDocumentCSS' in attrs)) attrs.useDocumentCSS = true;
       var scene = void 0;
       if (isNewVersion) {
@@ -13677,7 +13677,7 @@ function locateNode(vnode) {
     var style = getStyle(el);
     if (el instanceof BaseSprite) {
       var states = style.states;
-      if (!value && states.hide) {
+      if (!value && states && states.hide) {
         var beforeHide = { __default: true };
         if (states.beforeShow) {
           babel_runtime_core_js_object_keys__WEBPACK_IMPORTED_MODULE_0___default()(states.beforeShow).forEach(function (key) {
@@ -13692,7 +13692,7 @@ function locateNode(vnode) {
       }
       if (!value) {
         style.display = 'none';
-        style.quietSet('state', 'hide');
+        if (style.quietSet) style.quietSet('state', 'hide');
       }
       // if (value) el.show()
     } else {

dist/sprite-vue.min.js

@@ -29,7 +29,7 @@
       }
     },
     mounted () {
-      this.$refs.scene.delegateEvent('keydown', document)
+      // this.$refs.scene.delegateEvent('keydown', document)
     },
     methods: {
       keydown (evt) {

example/js/sprite-next.js

@@ -4,7 +4,8 @@
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width">
   <title>Example</title>
-  <script src="http://unpkg.com/spritejs/dist/spritejs.js"></script>
+  <!-- <script src="http://unpkg.com/[email protected]/dist/spritejs.js"></script> -->
+  <script src="/js/sprite-next.js"></script>
   <script src="/js/sprite-vue.js"></script>
   <!-- <script src="/js/sprite-vue-debug.js"></script> -->
   <style>

example/test-keyboard.html

@@ -23,15 +23,16 @@
 Vue.component('my-scene', {
   data () {
     return {
-      viewport: [600, 600],
+      width: 1200,
+      height: 1200,
       ccc: {
         bgcolor: 'blue'
       },
       state: true
     }
   },
   mounted () {
-    // console.log(this.$refs)
+    console.log(this.$refs)
     this.ccc.bgcolor = 'red'
     // this.attrs = { ... this.attrs }
     setTimeout(() => {
@@ -42,8 +43,8 @@
     }, 2000)
   },
   template: `
-    <scene id="container" :viewport=viewport>
-      <layer id="fglayer">
+    <scene id="container" :width=width :height=height ref="bbb">
+      <layer id="fglayer" ref="aaa">
         <sprite :attrs="ccc" :size="[100, 100]" :pos="[200, 200]"></sprite>
         <group>
           <sprite bgcolor="green" :size="[100, 100]" :pos="[400, 200]"></sprite>

example/test.html

@@ -1,6 +1,6 @@
 {
   "name": "sprite-vue",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "A Vue.js project for SpriteJS",
   "author": "akira-cn <[email protected]>",
   "main": "src/index.js",
@@ -14,7 +14,6 @@
   },
   "dependencies": {
     "babel-runtime": "^6.26.0",
-    "spritejs": "^2.29.6",
     "vue": "^2.5.17"
   },
   "devDependencies": {

example/test2.html

@@ -28,7 +28,7 @@ export default {
     const style = getStyle(el)
     if (el instanceof BaseSprite) {
       const states = style.states
-      if (!value && states.hide) {
+      if (!value && states && states.hide) {
         const beforeHide = { __default: true }
         if (states.beforeShow) {
           Object.keys(states.beforeShow).forEach((key) => {
@@ -43,7 +43,7 @@ export default {
       }
       if (!value) {
         style.display = 'none'
-        style.quietSet('state', 'hide')
+        if (style.quietSet) style.quietSet('state', 'hide')
       }
       // if (value) el.show()
     } else {

package.json

@@ -40,7 +40,7 @@ export function createElement (tagName: string, vnode: VNode): Element {
     if (tagName === 'scene') {
       const elm = document.createElement('div')
       if (attrs.id) elm.id = attrs.id
-      if (!vnode.data.ref) vnode.data.ref = 'scene'
+      if (!spritejs.isSpriteNode && !vnode.data.ref) vnode.data.ref = 'scene'
       if (!('useDocumentCSS' in attrs)) attrs.useDocumentCSS = true
       let scene
       if (isNewVersion) {