加载中...

Modal


实例代码

<template>
  <scroller>
    <wxc-panel title="Toast" type="primary">
      <wxc-button type="primary" onclick="{{toast}}" value="Toast"></wxc-button>
    </wxc-panel>

    <wxc-panel title="Dialog" type="primary">
      <wxc-button type="success" onclick="{{alert}}" value="Alert" style="margin-bottom: 20px;"></wxc-button>
      <wxc-button type="primary" onclick="{{confirm}}" value="Confirm" style="margin-bottom: 20px;"></wxc-button>
      <wxc-button type="warning" onclick="{{prompt}}" value="Prompt"></wxc-button>
    </wxc-panel>
  </scroller>
</template>

<script>
  require('weex-components');
  module.exports = {
    data: {},
    methods: {
      toast: function(msg, duration) {
        if (!msg || typeof msg !== 'string') {
          msg = 'I am Toast show!';
        }

        duration = duration || 2;
        var modal = require('@weex-module/modal');
        modal.toast({
          'message': msg,
          'duration': duration
        });

      },
      alert: function(msg, okTitle, cancelTitle) {
        var self = this;
        if (!msg || typeof msg !== 'string') {
          msg = "I am Alert!";
        }
         var modal = require('@weex-module/modal');
         modal.alert({
          'message': msg,
          'okTitle': okTitle,
          'cancelTitle': cancelTitle
        }, function() {
          self.toast("Click Alert OK Bnt!!");
        });

      },
      confirm: function(msg, okTitle, cancelTitle) {
        var self = this
        if (!msg || typeof msg !== 'string') {
          msg = "I am Confirm!";
        }
       var modal = require('@weex-module/modal');
        okTitle = okTitle || "OK";
        cancelTitle = cancelTitle || "Cancel";
        modal.confirm({
          'message': msg,
          'okTitle': okTitle,
          'cancelTitle': cancelTitle
        }, function(result) {
          self.toast("Click Confirm  " + result);
        });

      },
      prompt: function() {
        var self = this;
        var modal = require('@weex-module/modal');
        modal.prompt( {
          'message': 'I am Prompt!',
          'okTitle': 'ok',
          'cancelTitle': 'cancel'
        }, function(result) {
          self.toast("Click Prompt  " + result);
        });
       
      }
    }
  }
</script>

<style>
</style>

还没有评论.