c-dialog

对话框

属性

属性名类型必填默认值说明
titleString是对话框提示的标题
contentString是对话框提示的内容
typeString否alert对话框的类型，有效值：alert/confirm
cancel-textString否“取消”取消按钮的文字
cancel-styleObject否 自定义取消按钮的文案样式 如 {'color':'red','text-align':'center'}
confirm-textString否“确定”确认按钮的文字
confirm-styleObject否 自定义确认按钮的文案样式 如 {'color':'red','text-align':'center'}
icon-typeString否“warn”图标，有效值success/warn
icon-urlString否图标地址
icon-styleObject否图标的样式
maskBoolean否true是否显示透明蒙层
showBoolean否false开启打开alert类型对话框
show-closeBoolean否false是否显示close关闭图标
c-bind:showEventHandle否开启alert类型对话框时触发返回事件对象：event.type="changeShow",e.detail={value}
c-bind:cancelEventHandle否用户点击cancel时触发返回事件对象：event.type="cancelEvent"
c-bind:confirmEventHandle否用户点击confirm时触发返回事件对象：event.type="confirmEvent"
c-bind:closeEventHandle否点击close图标时触发返回事件对象： event.type="closeEvent"

示例

  1. <template>
  2.   <view class="toast-page">
  3.     <c-dialog show="{{true}}"
  4.               title="标题"
  5.               mask="{{true}}"
  6.               content="内容内容"
  7.     >
  8.     </c-dialog>
  9.   </view>
  10. </template>
  12. <script>
  13. class C_dialog   {
  14. }
  16. export default new C_dialog();
  17. </script>
  19. <script cml-type="json">
  20. {
  21.   "base": {
  22.     "usingComponents": {
  23.       "c-dialog": "cml-ui/components/c-dialog/c-dialog"
  24.     }
  25.   }
  26. }
  27. </script>

c-dialog - 图1wx

c-dialog - 图2web

c-dialog - 图3native

查看完整示例