iview中Modal對話框自定義頁頭頁腳

iview中Modal對話框自定義頁頭頁腳

  • Modal 組件提供了靈活的自定義樣式 API 和 Slot,可以自由控制整個 Modal 的各個組成部分,比如頁頭、頁腳、關閉按鈕。
  • 下面是完整代碼:
 <Modal v-model="modal2" width="360">
        <p slot="header" style="color:#f60;text-align:center">//對話框頁頭
            <Icon type="ios-information-circle"></Icon>
            <span>Delete confirmation</span>
        </p>
        <div style="text-align:center">//對話框主體
            <p>After this task is deleted, the downstream 10 tasks will not be implemented.</p>
            <p>Will you delete it?</p>
        </div>
        <div slot="footer">//對話框頁腳
            <Button type="error" size="large" long :loading="modal_loading" @click="del">Delete</Button>
        </div>
    </Modal>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章