iview [Feature Request]Modal:Add auto-close attribute and close callback in is-ok method for Modal

sdnqo3pr  于 6个月前  发布在  其他
关注(0)|答案(2)|浏览(114)

What problem does this feature solve?

As we use a form in Modal, If validation not passed, do not close the Modal automatic.

What does the proposed API look like?

add a attribute: auto-close Boolean
when auto-close is false, offer an argument for example close in is-ok callback. The modal will not be closed automatic util the user calls close method.

yhxst69z

yhxst69z1#

Hi, indeed we would need the modal to be controllable under this kind of occasion. However, it is also very important to make most of the modules "decoupled" for a better maintenance capability. Therefore, the Form and the Modal should not have a communication mediator inevitably.
But, you could still control the modal by using the Form's in-build method to achieve the effect.
Example

<template>
  <Modal v-modal="closeModal" :mask-closable="false" @on-ok="handleOnOk">
    <Form>
      <FormItem ref="form" :model="form" prop="input" :rules="rule">
        <Input v-model="form.input"></Input>
      </FormItem>
    </Form>
  </Modal>
</template>
<script>
export default {
data () {
return {
closeModal: false,
form: {
input: ''
},
rule: {
input: [
{ required: true, message: 'Could not be blank' }
]
}
}
},
methods: {
handleOnOk () {
this.$refs['form'].validate(isValid => {
// put your validation logics here
this.closeModal = isValid
})
}
}
}
</script>

@SergioCrisostomo

相关问题