w-component-vue 2.2.26 → 2.2.29

package/docs/module-WTableDyn.html

@@ -708,7 +708,7 @@
 <br class="clear">
 
 <footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Thu Jun 02 2022 15:37:39 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
+    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Sun Jul 10 2022 17:09:44 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
 </footer>
 
 <script>prettyPrint();</script>

package/docs/module-WText.html

@@ -422,7 +422,7 @@
 <br class="clear">
 
 <footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Thu Jun 02 2022 15:37:39 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
+    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Sun Jul 10 2022 17:09:44 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
 </footer>
 
 <script>prettyPrint();</script>

package/docs/module-WTextCore.html

@@ -248,7 +248,7 @@
 <br class="clear">
 
 <footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Thu Jun 02 2022 15:37:39 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
+    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Sun Jul 10 2022 17:09:44 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
 </footer>
 
 <script>prettyPrint();</script>

package/docs/module-WTextInt.html

@@ -374,7 +374,7 @@
 <br class="clear">
 
 <footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Thu Jun 02 2022 15:37:39 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
+    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Sun Jul 10 2022 17:09:44 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
 </footer>
 
 <script>prettyPrint();</script>

package/docs/module-WTextIntCore.html

@@ -278,7 +278,7 @@
 <br class="clear">
 
 <footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Thu Jun 02 2022 15:37:39 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
+    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Sun Jul 10 2022 17:09:44 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
 </footer>
 
 <script>prettyPrint();</script>

package/docs/module-WTextSelect.html

@@ -434,7 +434,7 @@
 <br class="clear">
 
 <footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Thu Jun 02 2022 15:37:39 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
+    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Sun Jul 10 2022 17:09:44 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
 </footer>
 
 <script>prettyPrint();</script>

package/docs/module-WTextSuggest.html

@@ -464,7 +464,7 @@
 <br class="clear">
 
 <footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Thu Jun 02 2022 15:37:39 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
+    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Sun Jul 10 2022 17:09:44 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
 </footer>
 
 <script>prettyPrint();</script>

package/docs/module-WTextSuggestCore.html

@@ -368,7 +368,7 @@
 <br class="clear">
 
 <footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Thu Jun 02 2022 15:37:39 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
+    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Sun Jul 10 2022 17:09:44 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
 </footer>
 
 <script>prettyPrint();</script>

package/docs/module-WTextarea.html

@@ -218,7 +218,7 @@
 <br class="clear">
 
 <footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Thu Jun 02 2022 15:37:39 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
+    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Sun Jul 10 2022 17:09:44 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
 </footer>
 
 <script>prettyPrint();</script>

package/docs/module-WTimeday.html

@@ -332,7 +332,7 @@
 <br class="clear">
 
 <footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Thu Jun 02 2022 15:37:39 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
+    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Sun Jul 10 2022 17:09:44 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
 </footer>
 
 <script>prettyPrint();</script>

package/docs/module-WTimedayCore.html

@@ -230,7 +230,7 @@
 <br class="clear">
 
 <footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Thu Jun 02 2022 15:37:39 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
+    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Sun Jul 10 2022 17:09:44 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
 </footer>
 
 <script>prettyPrint();</script>

package/docs/module-WTimedayRange.html

@@ -338,7 +338,7 @@
 <br class="clear">
 
 <footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Thu Jun 02 2022 15:37:39 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
+    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Sun Jul 10 2022 17:09:44 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
 </footer>
 
 <script>prettyPrint();</script>

package/docs/module-WTimedayRangeCore.html

@@ -242,7 +242,7 @@
 <br class="clear">
 
 <footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Thu Jun 02 2022 15:37:39 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
+    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Sun Jul 10 2022 17:09:44 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
 </footer>
 
 <script>prettyPrint();</script>

package/docs/module-WTimeminute.html

@@ -368,7 +368,7 @@
 <br class="clear">
 
 <footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Thu Jun 02 2022 15:37:39 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
+    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Sun Jul 10 2022 17:09:44 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
 </footer>
 
 <script>prettyPrint();</script>

package/docs/module-WTimeminuteCore.html

@@ -272,7 +272,7 @@
 <br class="clear">
 
 <footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Thu Jun 02 2022 15:37:39 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
+    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Sun Jul 10 2022 17:09:44 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
 </footer>
 
 <script>prettyPrint();</script>

package/docs/module-WTimeminuteRange.html

@@ -380,7 +380,7 @@
 <br class="clear">
 
 <footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Thu Jun 02 2022 15:37:39 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
+    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Sun Jul 10 2022 17:09:44 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
 </footer>
 
 <script>prettyPrint();</script>

package/docs/module-WTimeminuteRangeCore.html

@@ -284,7 +284,7 @@
 <br class="clear">
 
 <footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Thu Jun 02 2022 15:37:39 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
+    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Sun Jul 10 2022 17:09:44 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
 </footer>
 
 <script>prettyPrint();</script>

package/docs/module-WTinymceVueDyn.html

@@ -224,7 +224,7 @@
 <br class="clear">
 
 <footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Thu Jun 02 2022 15:37:39 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
+    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Sun Jul 10 2022 17:09:44 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
 </footer>
 
 <script>prettyPrint();</script>

package/docs/module-WTree.html

@@ -100,7 +100,7 @@
         <td>No</td>
         <td>輸入主動模式時處理點擊項目函數，給予並回傳true時代表點擊項目給予主動模式，回傳false代表點擊項目不給予主動模式，可應用於資料夾與有效項目之區隔，預設null</td>
     </tr><tr>
-        <td><code>activeItem</code></td>
+        <td><code>itemActive</code></td>
         <td>Object</td>
         <td><code>{}</code></td>
         <td>No</td>
@@ -290,7 +290,13 @@
         <td>Number</td>
         <td><code>34</code></td>
         <td>No</td>
-        <td>輸入按需顯示時各項目預設高度值，給越準或給大部分項目的高度則渲染速度越快，單位為px，預設34</td>
+        <td>輸入按需顯示時各項目預設最小高度(min-height)值，給越準或給大部分項目的高度則渲染速度越快，單位為px，預設34</td>
+    </tr><tr>
+        <td><code>=null</code></td>
+        <td>Number</td>
+        <td>-</td>
+        <td>No</td>
+        <td>輸入按需顯示時各項目圖標預設最小高度(min-height)值，通常不給由defItemHeight決定，若有給則取與defItemHeight之較大者，單位為px，預設null</td>
     </tr><tr>
         <td><code>itemsPreload</code></td>
         <td>Number</td>
@@ -626,7 +632,7 @@
 <br class="clear">
 
 <footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Thu Jun 02 2022 15:37:39 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
+    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Sun Jul 10 2022 17:09:44 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
 </footer>
 
 <script>prettyPrint();</script>

package/docs/module-WTreeIconCheckbox.html

@@ -248,7 +248,7 @@
 <br class="clear">
 
 <footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Thu Jun 02 2022 15:37:39 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
+    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Sun Jul 10 2022 17:09:44 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
 </footer>
 
 <script>prettyPrint();</script>

package/docs/module-WTreeIconToggle.html

@@ -224,7 +224,7 @@
 <br class="clear">
 
 <footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Thu Jun 02 2022 15:37:39 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
+    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Sun Jul 10 2022 17:09:44 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
 </footer>
 
 <script>prettyPrint();</script>

package/docs/vuetifyColor.mjs.html

@@ -144,7 +144,7 @@ export default color2hex
 <br class="clear">
 
 <footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Thu Jun 02 2022 15:37:38 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
+    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a> on Sun Jul 10 2022 17:09:44 GMT+0800 (台北標準時間) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
 </footer>
 
 <script>prettyPrint();</script>

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "w-component-vue",
-  "version": "2.2.26",
+  "version": "2.2.29",
   "main": "dist/w-component-vue.umd.js",
   "dependencies": {
-    "@mdi/js": "^6.7.96",
+    "@mdi/js": "^6.9.96",
     "lodash": "^4.17.21",
-    "wsemi": "^1.6.67"
+    "wsemi": "^1.6.69"
   },
   "devDependencies": {
     "eslint": "^7.26.0",

package/src/AppZoneWJsonView.vue

@@ -85,6 +85,30 @@
             </div>
 
 
+            <div class="bk dz">
+                <demolink
+                    :kbname="'w-json-view'"
+                    :casename="'toggleItemsByFun'"
+                ></demolink>
+
+                <div>
+                    <v-btn style="margin:0px 5px 5px 0px;" small @click="toggleItems(0)">toggle(rows[0])</v-btn>
+                    <v-btn style="margin:0px 5px 5px 0px;" small @click="toggleItems(0, true)">show(rows[0])</v-btn>
+                    <v-btn style="margin:0px 5px 5px 0px;" small @click="toggleItems(0, false)">hide(rows[0])</v-btn>
+                    <v-btn style="margin:0px 5px 5px 0px;" small @click="toggleItems(6)">toggle(rows[6])</v-btn>
+                    <v-btn style="margin:0px 5px 5px 0px;" small @click="toggleItems(9)">toggle(rows[9])</v-btn>
+                </div>
+
+                <w-json-view
+                    ref="ref_toggleItemsByFun"
+                    style="border:1px solid #ddd;"
+                    :viewHeightMax="WJsonView.viewHeightMaxSync"
+                    :data="WJsonView.data3"
+                ></w-json-view>
+
+            </div>
+
+
             <div class="bk dz">
                 <demolink
                     :kbname="'w-json-view'"
@@ -294,6 +318,21 @@ export default {
             }
             return b
         },
+        toggleItems: function(ind, toUnfolding) {
+            console.log('toggleItems', ind, toUnfolding)
+
+            let vo = this
+
+            //toggleItemsByFun
+            vo.$refs.ref_toggleItemsByFun.toggleItemsByFun((rows) => {
+                console.log('toggleItems rows', rows)
+                return {
+                    row: rows[ind],
+                    toUnfolding,
+                }
+            })
+
+        },
     },
 }
 </script>

package/src/AppZoneWTree.vue

@@ -25,12 +25,12 @@
             <div class="bk dz">
                 <demolink
                     :kbname="'w-tree'"
-                    :casename="'iconSize'"
+                    :casename="'iconSize(20)'"
                 ></demolink>
 
                 <w-tree
                     style="border:1px solid #ddd;"
-                    :iconSize="24"
+                    :iconSize="20"
                     :data="WTree.option.items"
                 ></w-tree>
 
@@ -40,12 +40,12 @@
             <div class="bk dz">
                 <demolink
                     :kbname="'w-tree'"
-                    :casename="'iconSize(24) & defItemHeight(24)'"
+                    :casename="'iconSize(20) & defItemHeight(24)'"
                 ></demolink>
 
                 <w-tree
                     style="border:1px solid #ddd;"
-                    :iconSize="24"
+                    :iconSize="20"
                     :defItemHeight="24"
                     :data="WTree.option.items"
                 ></w-tree>
@@ -120,6 +120,29 @@
             </div>
 
 
+            <div class="bk dz">
+                <demolink
+                    :kbname="'w-tree'"
+                    :casename="'toggleItemsByFun'"
+                ></demolink>
+
+                <div>
+                    <v-btn style="margin:0px 5px 5px 0px;" small @click="toggleItems(0)">toggle(rows[0])</v-btn>
+                    <v-btn style="margin:0px 5px 5px 0px;" small @click="toggleItems(0, true)">show(rows[0])</v-btn>
+                    <v-btn style="margin:0px 5px 5px 0px;" small @click="toggleItems(0, false)">hide(rows[0])</v-btn>
+                    <v-btn style="margin:0px 5px 5px 0px;" small @click="toggleItems(1)">toggle(rows[1])</v-btn>
+                </div>
+
+                <w-tree
+                    ref="ref_toggleItemsByFun"
+                    style="border:1px solid #ddd;"
+                    :viewHeightMax="WTree.viewHeightMaxSync"
+                    :data="WTree.option.items"
+                ></w-tree>
+
+            </div>
+
+
             <div class="bk dz">
                 <demolink
                     :kbname="'w-tree'"
@@ -204,16 +227,16 @@
             <div class="bk dz">
                 <demolink
                     :kbname="'w-tree'"
-                    :casename="'activable & activeItem'"
+                    :casename="'activable & itemActive'"
                 ></demolink>
 
-                <div style="font-size:0.8rem;">activeItem: {{WTree.option.activeItem}}</div>
+                <div style="font-size:0.8rem;">itemActive: {{WTree.option.itemActive}}</div>
 
                 <w-tree
                     style="border:1px solid #ddd;"
                     :data="WTree.option.items"
                     :activable="true"
-                    :activeItem.sync="WTree.option.activeItem"
+                    :itemActive.sync="WTree.option.itemActive"
                     @click="clickActive"
                 ></w-tree>
 
@@ -223,16 +246,16 @@
             <div class="bk dz">
                 <demolink
                     :kbname="'w-tree'"
-                    :casename="'activable & activeItem & funActive'"
+                    :casename="'activable & itemActive & funActive'"
                 ></demolink>
 
-                <div style="font-size:0.8rem;">activeItem: {{WTree.option.activeItem}}</div>
+                <div style="font-size:0.8rem;">itemActive: {{WTree.option.itemActive}}</div>
 
                 <w-tree
                     style="border:1px solid #ddd;"
                     :data="WTree.option.items"
                     :activable="true"
-                    :activeItem.sync="WTree.option.activeItem"
+                    :itemActive.sync="WTree.option.itemActive"
                     :funActive="funActive"
                     @click="clickActive"
                 ></w-tree>
@@ -243,16 +266,16 @@
             <div class="bk dz">
                 <demolink
                     :kbname="'w-tree'"
-                    :casename="'activable & activeItem & itemTextColor & itemTextColorHover & itemTextColorActive & itemBackgroundColor & itemBackgroundColorHover & itemBackgroundColorActive'"
+                    :casename="'activable & itemActive & itemTextColor & itemTextColorHover & itemTextColorActive & itemBackgroundColor & itemBackgroundColorHover & itemBackgroundColorActive'"
                 ></demolink>
 
-                <div style="font-size:0.8rem;">activeItem: {{WTree.option.activeItem}}</div>
+                <div style="font-size:0.8rem;">itemActive: {{WTree.option.itemActive}}</div>
 
                 <w-tree
                     style="border:1px solid #ddd; background:#444;"
                     :data="WTree.option.items"
                     :activable="true"
-                    :activeItem.sync="WTree.option.activeItem"
+                    :itemActive.sync="WTree.option.itemActive"
                     :itemTextColor="'#ccc'"
                     :itemTextColorHover="'#eee'"
                     :itemTextColorActive="'#fff'"
@@ -555,32 +578,6 @@
             </div>
 
 
-            <div class="bk dz">
-                <demolink
-                    :kbname="'w-tree'"
-                    :casename="'slot'"
-                ></demolink>
-
-                <w-tree
-                    style="border:1px solid #ddd;"
-                    :data="WTree.option.items"
-                >
-                    <template v-slot:item="props">
-
-                        <div style="display:flex; align-items:center; min-height:34px;">
-                            {{props.data.text}}
-                        </div>
-
-                        <div style="padding:5px; background:#fee; font-size:0.7rem;">
-                            addition text
-                        </div>
-
-                    </template>
-                </w-tree>
-
-            </div>
-
-
             <div class="bk dz">
                 <demolink
                     :kbname="'w-tree'"
@@ -702,6 +699,68 @@
             </div>
 
 
+            <div class="bk" style="display:block; margin:0px 10px 0px 0px;">
+                <demolink
+                    :kbname="'w-tree'"
+                    :casename="'slot & selectable & iconSize(20) & defItemHeight(24)'"
+                ></demolink>
+
+                <!-- 用:style才能支援IE11因vue會自動把overflow-x:auto轉為-ms-overflow-x:auto -->
+                <div :style="'overflow-x:auto;'">
+
+                    <div style="display:table-cell; vertical-align:top;">
+                        <w-tree
+                            style="width:500px; border:1px solid #ddd;"
+                            :data="WTree.option.items"
+                            :selectable="true"
+                            :selections.sync="WTree.option.selections"
+                            :iconSize="20"
+                            :defItemHeight="24"
+                            @update:selections="changeSelections"
+                        >
+                            <template v-slot:item="props">
+                                <div style="display:flex;">
+
+                                    <div style="display:flex; align-items:center; padding-right:5px;" v-if="props.data.avatar">
+                                        <img style="border-radius:50%; width:24px; height:24px;" :src="props.data.avatar" />
+                                    </div>
+
+                                    <div style="display:flex; align-items:center; padding-right:5px;" v-if="props.data.icon">
+                                        <v-icon size="18" color="deep-orange">{{props.data.icon}}</v-icon>
+                                    </div>
+
+                                    <div style="">
+                                        <div style="display:flex; align-items:center;">
+                                            <div style="margin-right:7px;">
+                                                {{props.data.text}}
+                                                <div style="display:inline-block; color:#26f; font-size:0.7rem;">[id:{{props.data.id}}]</div>
+                                            </div>
+                                            <div style="padding:0px 9px; font-size:0.7rem; color:#fff; border-radius:30px; background:#f26;" v-if="props.data.key">{{props.data.key}}</div>
+                                        </div>
+                                        <div style="padding-right:20px;" v-if="props.data.msg">
+                                            <div style="font-size:0.7rem; color:#999; text-indent:1rem; padding:12px 18px; background:#fefafa;">{{props.data.msg}}</div>
+                                        </div>
+                                    </div>
+
+                                </div>
+
+                            </template>
+                        </w-tree>
+                    </div>
+
+                    <div style="display:table-cell; vertical-align:top;">
+                        <!-- 用:style才能支援IE11因vue會自動把overflow-y:auto轉為-ms-overflow-y:auto -->
+                        <div :style="'padding:10px 20px; height:402px; overflow-y:auto; border:1px solid #ddd; border-left-width:0px;'">
+                            <div style="margin-bottom:5px;">selections: </div>
+                            <pre style="font-size:0.7rem;">{{JSON.stringify(showSelection(WTree.option.selections),null,4)}}</pre>
+                        </div>
+                    </div>
+
+                </div>
+
+            </div>
+
+
             <div class="bk" style="display:block; margin:0px 10px 0px 0px;">
                 <demolink
                     :kbname="'w-tree'"
@@ -1095,7 +1154,7 @@ export default {
                         { 'id': 18 },
                         //勾選id:18會自動再加入id:19
                     ],
-                    activeItem: {
+                    itemActive: {
                         'id': 4
                     },
                     items: [
@@ -1546,6 +1605,21 @@ export default {
             }
             return b
         },
+        toggleItems: function(ind, toUnfolding) {
+            console.log('toggleItems', ind, toUnfolding)
+
+            let vo = this
+
+            //toggleItemsByFun
+            vo.$refs.ref_toggleItemsByFun.toggleItemsByFun((rows) => {
+                console.log('toggleItems rows', rows)
+                return {
+                    row: rows[ind],
+                    toUnfolding,
+                }
+            })
+
+        },
     },
 }
 </script>

package/src/components/WDynamicList.vue

@@ -261,6 +261,17 @@ export default {
     },
     methods: {
 
+        getRows: function() {
+            //console.log('methods getRows')
+
+            let vo = this
+
+            //rows
+            let rows = gm.get(vo.mmkey)
+
+            return rows
+        },
+
         setRowsCore: function(rows) {
             // console.log('methods setRowsCore', rows)
 

package/src/components/WJsonView.vue

@@ -119,7 +119,8 @@ import WTree from './WTree.vue'
  * @vue-prop {String} [loadingText='Loading...'] 輸入載入中字串，預設'Loading...'
  * @vue-prop {String} [noResultsText='No results'] 輸入無過濾結果字串，預設'No results'
  * @vue-prop {String} [searchingText='Searching...'] 輸入搜索中字串，預設'Searching...'
- * @vue-prop {Number} [defItemHeight=24] 輸入按需顯示時各項目預設高度值，給越準或給大部分項目的高度則渲染速度越快，單位為px，預設24
+ * @vue-prop {Number} [defItemHeight=24] 輸入按需顯示時各項目預設最小高度(min-height)值，給越準或給大部分項目的高度則渲染速度越快，單位為px，預設24
+ * @vue-prop {Number} [=null] 輸入按需顯示時各項目圖標預設最小高度(min-height)值，通常不給由defItemHeight決定，若有給則取與defItemHeight之較大者，單位為px，預設null
  * @vue-prop {Number} [itemsPreload=5] 輸入上下方預先載入元素數量，預設5
  * @vue-prop {String} [keyColor='grey darken-2'] 輸入鍵值顏色字串，預設'grey darken-2'
  * @vue-prop {String} [keyNumbersColor='grey lighten-1'] 輸入鍵值內含子節點數量顏色字串，預設'grey lighten-1'
@@ -541,6 +542,14 @@ export default {
             return c
         },
 
+        toggleItemsByFun: function(cb) {
+            // console.log('methods toggleItemsByFun', cb)
+
+            let vo = this
+
+            return vo.$refs.wt.toggleItemsByFun(cb)
+        },
+
     },
 }
 </script>