```html
<div class="demo-block" id="x-progress-demo1">
  <br>
  <lx-x-progress :percent="percent1" />
  <br>
  <lx-box gap="10px">
    <lx-x-progress
      :percent="percent2"
      :show-cancel="false"
    />
  </lx-box>
</div>


<script>
// XProgress.md
new Vue({
  el: '#x-progress-demo1',
  
  data: {
    percent1: 30,
    percent2: 60
  }
})
</script>
```