weex-nuke
Version:
基于 Rax 、Weex 的高性能组件体系 ~~
106 lines (96 loc) • 2.34 kB
Markdown
# 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 />);
```