```html
<div class="demo-block" id="checklist-demo1">
  <lx-checklist
    v-model="checklist001"
    title="default checklist"
    label-position="left"
    :options="commonList"
    @on-change="change"
  ></lx-checklist>
  <lx-checklist
    v-model="checklist002"
    title="preselect China and Japan"
    :options="commonList"
    @on-change="change"
  ></lx-checklist>

  <lx-checklist
    v-model="checklist003"
    title="set max=2"
    :options="commonList"
    :max="2"
    @on-change="change"
  ></lx-checklist>

  <lx-checklist
    v-model="checklist004"
    title="set required=false and no min-error will show"
    :options="commonList"
    :max="2"
    :required="false"
    @on-change="change"
  ></lx-checklist>

  <lx-checklist
    v-model="checklist005Value"
    title="set random order"
    random-order
    :options="checklist005"
    @on-change="change"
  ></lx-checklist>

  <lx-checklist
    v-model="objectListValue"
    title="Option Array with key and value(key must be string)"
    :options="objectList"
    @on-change="change"
  ></lx-checklist>

  <lx-checklist
    v-model="asyncListValue"
    title="Async list"
    :max="3"
    :options="asyncList"
    @on-change="change"
  ></lx-checklist>

  <lx-divider>Reference</lx-divider>
  <lx-group title="See also">
    <lx-cell
      title="Checker"
      value="with which you can custom any style"
      is-link
      link="/component/checker"
    ></lx-cell>
  </lx-group>
</div>

<script>
// Checklist.md
new Vue({
  el: '#checklist-demo1',
  data: {
    commonList: ['China', 'Japan', 'America'],
    checklist001: [],
    checklist002: ['China', 'Japan'],
    checklist003: ['China', 'Japan'],
    checklist004: [],
    checklist005: ['01', '02', '03'],
    checklist005Value: [],
    objectList: [{ key: '1', value: '001 value' }, { key: '2', value: '002 value' }, { key: '3', value: '003 value' }],
    objectListValue: ['1', '2'],
    asyncList: [],
    asyncListValue: []
  },
  mounted() {
    setTimeout(() => {
      this.asyncList = ['A', 'B', 'C', 'D']
    }, 3000)
  },
  methods: {
    change(val) {
      console.log('change', val)
    }
  }
})
</script>
```