weex-nuke/docs/radio/demo/theme.md

基于 Rax 、Weex 的高性能组件体系 ~~

# Radio theme demo

* order: 0

主题配置

---

```js
/** @jsx createElement */
import { View, Text, Radio, Page, ThemeProvider } from 'weex-nuke';
const { StyleProvider } = ThemeProvider;
import { createElement, Component, render } from 'rax';
const theme = {
  Radio: {
    'dot-border-color': 'red',
    'dot-checked-border-color': 'red',
    'dot-bg-color-selected': 'red',
  },
};

let App = class NukeDemoIndex extends Component {
  constructor() {
    super();
  }

  render() {
    return (
      <Page title="Radio">
        <Page.Intro sub="theme inject" />
        <View style={styles.demo_item}>
          <StyleProvider style={theme}>
            <Radio size="small" type="dot" />
            <Text>浙江省</Text>
          </StyleProvider>
        </View>
      </Page>
    );
  }
};
const styles = {
  demo_item: {
    height: 104,
    marginBottom: 30,
    backgroundColor: '#ffffff',
    flexDirection: 'row',
    alignItems: 'center',
    paddingLeft: 12,
  },
  demo_result: {
    backgroundColor: '#ffffff',
    paddingLeft: 32,
    height: 60,
    justifyContent: 'center',
    color: '#666666',
  },
};
render(<App />);
```