iview 的低级bug

Modal 里面的内容如果长，会溢出

<template>
    <Button @click="modal12 = true">Open the first modal</Button>
    <Button @click="modal13 = true">Open the second modal</Button>
    <Modal v-model="modal12" draggable scrollable title="Modal 1">
        <div>
      ytmsfycy,ytmsfycy_en,yfjsfycy,yfjsfycy_en,cysmytmsfycy,ytmsfycy_en,yfjsfycy,yfjsfycy_en,cysmytmsfycy,ytmsfycy_en,yfjsfycy,yfjsfycy_en,cysmytmsfycy,ytmsfycy_en,yfjsfycy,yfjsfycy_en,cysmytmsfycy,ytmsfycy_en,yfjsfycy,yfjsfycy_en,cysmytmsfycy,ytmsfycy_en,yfjsfycy,yfjsfycy_en,cysmytmsfycy,ytmsfycy_en,yfjsfycy,yfjsfycy_en,cysmytmsfycy,ytmsfycy_en,yfjsfycy,yfjsfycy_en,cysmytmsfycy,ytmsfycy_en,yfjsfycy,yfjsfycy_en,cysmytmsfycy,ytmsfycy_en,yfjsfycy,yfjsfycy_en,cysmytmsfycy,ytmsfycy_en,yfjsfycy,yfjsfycy_en,cysmytmsfycy,ytmsfycy_en,yfjsfycy,yfjsfycy_en,cysmytmsfycy,ytmsfycy_en,yfjsfycy,yfjsfycy_en,cysmytmsfycy,ytmsfycy_en,yfjsfycy,yfjsfycy_en,cysm
      </div>
    </Modal>
    <Modal v-model="modal13" draggable scrollable title="Modal 2">
        <div>This is the second modal</div>
    </Modal>
</template>
<script>
    export default {
        data () {
            return {
                modal12: false,
                modal13: false
            }
        }
    }
</script>

解决方法：增加div控制

<Modal width="1000"  :scrollable="true"  v-model="modal_see" title='<@s.message code ="XWGL.ACTION.CK"/>' :mask-closable="false" >

             <div style="word-wrap: break-word;white-space: normal;word-break: break-all;">

</div>
</Modal>

或者通过样式重新

     .ivu-modal-body{
         word-wrap: break-word;
         white-space: normal;
         word-break: break-all;
     }

猜你喜欢