# Dialog 静态调用

- order: 2
- title_en : Dialog static call demo

---

```js
<NukePlayGround>
  // with alert button
  Dialog.alert({
    title: "A Short Title is Best",
    content: msg,
    locale: { confirm: "Primary" }
  });
  //  with confirm button
  Dialog.confirm({
    title: "A Short Title is Best",
    content: msg,
    locale: { confirm: "OK" ,cancel:"Don't agree"}
  });
  // no buttons
  Dialog.show({
    title: "Doctor shows",
    content: "Your diagnosis"
  });
</NukePlayGround>
```

---

```js
/** @jsx createElement */
import { createElement, Component, render } from 'rax';
import View from 'nuke-view';
import Text from 'nuke-text';
import Env from 'nuke-env';
import ScrollView from 'nuke-scroll-view';
import Dialog from 'nuke-dialog';
import Button from 'nuke-button';
import Page from 'nuke-page';

const msg =
  Env.appInfo.platform === 'iOS'
    ? 'A message should be a short, complete sentence.'
    : 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna wirl aliqua. Up exlaborum incididunt.';
let App = class NukeDemoIndex extends Component {
  constructor() {
    super();
  }

  confirm = () => {
    Dialog.confirm({
      title: 'A Short Title is Best',
      content: msg,
      locale: { confirm: 'Primary' }
    });
  };

  alert = () => {
    Dialog.alert({
      title: 'A Short Title is Best',
      content: msg,
      locale: { confirm: 'Primary' }
    });
  };
  alertLong = () => {
    Dialog.alert({
      title: 'A longer title can extend over multiple lines',
      content: msg,
      locale: { confirm: 'Primary' }
    });
  };
  show = () => {
    Dialog.show({
      title: 'Doctor shows',
      content: 'Your diagnosis'
    });
  };

  render() {
    return (
      <Page title="Dialog Static">
        <Page.Intro main="Alert" />
        <Button style={styles.btn} type="primary" onPress={this.alert}>
          Alert
        </Button>
        <Button style={styles.btn} type="primary" onPress={this.alertLong}>
          Alert with long title
        </Button>
        <Page.Intro main="Confirm" />
        <Button style={styles.btn} type="primary" onPress={this.confirm}>
          Confirm
        </Button>
      </Page>
    );
  }
};
var styles = {
  btn: {
    marginBottom: 30
  }
};
render(<App />);
```