```html
<div class="demo-block" id="countdown-demo1">
  <lx-group title="auto countdown">
    <lx-cell
      title="15s"
      :value="value"
    >
      <lx-countdown
        v-show="show"
        slot="value"
        v-model="options1"
        @on-finish="finish"
      ></lx-countdown>
    </lx-cell>
  </lx-group>
  <lx-group title="manually">
    <lx-x-switch
      v-model="options2.start"
      title="start"
    ></lx-x-switch>
    <lx-cell title="15s">
      <lx-countdown
        slot="value"
        v-model="options2"
        :start="options2.start"
        @on-finish="finish2"
      ></lx-countdown>
    </lx-cell>
  </lx-group>
</div>

<script>
// Countdown.md
new Vue({
  el: '#countdown-demo1',
  data: {
    options1: {
      time: 15,
      start: true
    },
    options2: {
      time: 15,
      start: false
    },
    show: true,
    time: 15,
    value: '',
    start: false
  },
  methods: {
    finish (index) {
      this.show = false
      this.value = 'completed'
    },
    finish2 (index) {
      this.options2.start = false
      // this.time = 20
      this.options2.time = 20
    }
  }
})
</script>
```