Add batch show/hide column example and update debug domain

Author: wenzhixin

assets/js/index.js

@@ -1,4 +1,4 @@
-const isDebug = ['localhost', '127.0.0.1'].includes(location.hostname)
+const isDebug = ['localhost', '127.0.0.1', 'test.examples.wenzhixin.net.cn'].includes(location.hostname)
 const { computed, createApp, onMounted, ref } = window.Vue
 
 const Utils = {

assets/js/template.js

@@ -1,6 +1,6 @@
 window._config = {
   isDebug: location.hash.slice(1) === 'is-debug' ||
-    ['localhost', '127.0.0.1', 'dev.bootstrap-table.com'].includes(location.hostname),
+    ['localhost', '127.0.0.1', 'test.examples.wenzhixin.net.cn'].includes(location.hostname),
   cdnUrl: 'https://cdn.jsdelivr.net/npm/bootstrap-table@1.27.2/dist/',
   localUrl: '../bootstrap-table/src/',
   testUrl: '/src/'

methods/show-hide-column.html

@@ -1,7 +1,7 @@
 <script>
 init({
   title: 'Show/Hide Column',
-  desc: 'Show/Hide the specified column:<br>`$table.bootstrapTable(\'showColumn\', \'name\')`<br>`$table.bootstrapTable(\'hideColumn\', \'name\')`.',
+  desc: 'Show/Hide the specified column:<br>`$table.bootstrapTable(\'showColumn\', \'name\')`<br>`$table.bootstrapTable(\'hideColumn\', \'name\')`<br><br>Show/Hide multiple columns:<br>`$table.bootstrapTable(\'showColumn\', [\'name\', \'price\'])`<br>`$table.bootstrapTable(\'hideColumn\', [\'name\', \'price\'])`.',
   links: ['bootstrap-table.min.css'],
   scripts: ['bootstrap-table.min.js']
 })
@@ -21,6 +21,18 @@
     >
       hideColumn
     </button>
+    <button
+      id="button3"
+      class="btn btn-secondary"
+    >
+      showColumn (batch)
+    </button>
+    <button
+      id="button4"
+      class="btn btn-secondary"
+    >
+      hideColumn (batch)
+    </button>
   </div>
   <table
     id="table"
@@ -50,6 +62,8 @@
   const $table = $('#table')
   const $button = $('#button')
   const $button2 = $('#button2')
+  const $button3 = $('#button3')
+  const $button4 = $('#button4')
 
   function mounted () {
     $button.click(function () {
@@ -58,5 +72,11 @@
     $button2.click(function () {
       $table.bootstrapTable('hideColumn', 'name')
     })
+    $button3.click(function () {
+      $table.bootstrapTable('showColumn', ['name', 'price'])
+    })
+    $button4.click(function () {
+      $table.bootstrapTable('hideColumn', ['name', 'price'])
+    })
   }
 </script>