weex-nuke
Version:
基于 Rax 、Weex 的高性能组件体系 ~~
85 lines (82 loc) • 2.26 kB
JSX
/** @jsx createElement */
import { createElement, Component, render } from 'rax';
import View from 'nuke-view';
import Text from 'nuke-text';
import Checkbox from 'nuke-checkbox';
import Page from 'nuke-page';
const Styles = {
demo_item: {
width: 750,
height: 104,
marginTop: 30,
backgroundColor: '#ffffff',
justifyContent: 'center',
paddingLeft: 12,
},
};
const App = class NukeDemoIndex extends Component {
constructor() {
super();
this.state = {
checked: false,
};
}
render() {
return (
<Page title="checkbox">
<Page.Intro main="Checkbox" sub="normal" />
<View style={Styles.demo_item}>
<Checkbox size="small" />
</View>
<Page.Intro sub="selected" />
<View style={Styles.demo_item}>
<Checkbox size="small" defaultChecked />
</View>
<Page.Intro sub="selected" />
<View style={Styles.demo_item}>
<Checkbox size="small" defaultChecked type="empty" />
</View>
<Page.Intro sub="disabled" />
<View style={Styles.demo_item}>
<Checkbox size="small" disabled type="normal" />
</View>
<Page.Intro sub="disabled-selected" />
<View style={Styles.demo_item}>
<Checkbox
size="small"
disabled
defaultChecked
type="empty"
/>
</View>
<Page.Intro main="Checkbox-List" sub="normal" />
<View style={Styles.demo_item}>
<Checkbox size="small" defaultChecked={false} type="list" />
</View>
<Page.Intro sub="selected" />
<View style={Styles.demo_item}>
<Checkbox size="small" defaultChecked type="list" />
</View>
<Page.Intro sub="disabled" />
<View style={Styles.demo_item}>
<Checkbox
size="small"
disabled
defaultChecked={false}
type="list"
/>
</View>
<Page.Intro sub="disabled-selected" />
<View style={Styles.demo_item}>
<Checkbox
size="small"
disabled
defaultChecked
type="list"
/>
</View>
</Page>
);
}
};
render(<App />);