```html
<div class="demo-block" id="loading-demo1">
  <lx-group>
    <lx-x-switch
      v-model="show1"
      title="Toggle"
      @on-change="show1change"
    ></lx-x-switch>
  </lx-group>
  <lx-loading
    :show="show1"
    :text="text1"
  ></lx-loading>
</div>

<script>
// Loading.md
function tick (i, cb) {
  setTimeout(function () {
    i++
    cb(i)
    if (i < 100) {
      tick(i, cb)
    }
  }, 50)
}
new Vue({
  el: '#loading-demo1',
  data: {
    show1: false,
    text1: 'Processing'
  },
  methods: {
    show1change (val) {
      if (val) {
        tick(0, (percent) => {
          if (percent === 100) {
            this.show1 = false
            this.text1 = 'Start processing'
            return
          }
          this.text1 = `${percent}% completed`
        })
      }
    }
  }
})
</script>
```