iview Modal对话框点击确定按钮后不关闭

<template>
  <div>
    <Button type="primary" @click="modal1 = true">Display dialog box</Button>
    <Modal v-model="modal1" title="Common Modal dialog box title" @on-ok="ok" @on-cancel="cancel">
      <p>Content of dialog</p>
      <p>Content of dialog</p>
      <p>Content of dialog</p>
    </Modal>
  </div>
</template>

<script>
export default {
     
  data () {
     
    return {
     
      modal1: false
    }
  },
  methods: {
     
    ok () {
     
      this.$Message.info('Clicked ok');
    },
    cancel () {
     
      this.$Message.info('Clicked cancel');
    }
  }
}
</script>

iview Modal对话框点击确定按钮后不关闭_第1张图片
自定义页脚后可避免其关闭

 <Modal v-model="modal1" title="Common Modal dialog box title" @on-ok="ok" @on-cancel="cancel">
      <p>Content of dialog</p>
      <p>Content of dialog</p>
      <p>Content of dialog</p>
      <div slot="footer">
        <Button type="text" @click="cancel">取消</Button>
        <Button type="primary" @click="ok">确定</Button>
      </div>
    </Modal>

你可能感兴趣的:(iview)