naive-ui/demo/documentation/components/pagination/zhCN/disabled.demo.md
07akioni 487001d697 build: add changelog to site, refactor loader based on suffix
.demo.md for component demo
.demo-entry.md for demo entry
.md for common docs
2020-08-19 23:30:04 +08:00

625 B

禁用

<n-pagination
  v-model="page"
  :page-count="100"
  show-size-picker
  :page-size="pageSize"
  :page-sizes="[10, 20, 30, 40]"
  show-quick-jumper
  :disabled="disabled"
  @page-size-change="handlePageSizeChange"
  :style="{ marginBottom: '12px' }"
/>
<n-switch v-model="disabled" />
export default {
  data () {
    return {
      page: 2,
      pageSize: 20,
      disabled: true
    }
  },
  methods: {
    handlePageSizeChange (pageSize) {
      this.pageSize = pageSize
      this.$NMessage.info(`Page size is set to ${pageSize}`)
    }
  }
}
.n-switch {
  margin-left: 12px;
}