v-modal

模态对话框。

方法

名称 作用
open 打开（显示）对话框
close 关闭（显示）对话框

页面

<div id="example">
  <v-modal v-rel:dialog>
    这里是对话框内容
  </v-modal>
  <button @click="openDlg">打开对话框</button>
</div>

<script source="assets/javascripts/example.js"></script>

脚本

# assets/javascripts/example.js.coffee
$ ->
   new Vue(
     el:"#example"
     methods:
        openDlg:->
          @$refs.dialog.open()
   )

属性

属性 类型 作用
ok String 默认确认按钮的文字，默认值为 “确认”
cancel String 取消按钮上的文字，默认值为 "取消"
header String 对话框的标题文字
size String 对话框的大小，可选值为 sm,md,lg
remoteUrl String 指定加载的远程内容地址。当对话框打开时通过,ajax加载
closed Function 关闭对话框时执行的回调函数

可自定义的模板

名称 说明
heading 标题栏
footer 对话框的内容页脚

自定义模板的用法：

 <v-modal v-rel:dialog>
   <div slot="heading">
     <!--这里是自定义的标题栏-->
     <h3>标题文字</h3>
   </div>
   这里是对话框内容
    <div slot="footer">
       <!--这里是自定义的页脚-->
       <button data-dismiss="modal">关闭</button>
    </div>
 </v-modal>

results matching ""

    No results matching ""