weex-nuke/lib/node_modules/nuke-util/docs/basic.md

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

# 工具集

- order: 0
- title_en: Tool set


---
```js
<NukePlayGround>
  const { urlHelper } = Util;
  const { getSearchParameter } = urlHelper;
  this.state = {
      id: getSearchParameter(search, 'id'),
      type: getSearchParameter(search, 'type')
    };
</NukePlayGround>
```
---

```js
/** @jsx createElement */
import { createElement, Component, render } from 'rax';
import View from 'nuke-view';
import Text from 'nuke-text';
import Page from 'nuke-page';
import Util from 'nuke-util';
const { urlHelper, Location } = Util;
const { getSearchParameter } = urlHelper;
const search = '?id=987&type=1';

let App = class NukeDemoIndex extends Component {
  constructor() {
    super();
    this.state = {
      loc: JSON.stringify(Util.Location),
      search: search,
      id: getSearchParameter(search, 'id'),
      type: getSearchParameter(search, 'type')
    };
  }

  render() {
    return (
      <Page title="Util">
        <Page.Intro main="Location" />
        <View style={styles.resultLine}>
          <Text style={styles.resultLabel}>Location</Text>
          <Text style={styles.resultText}>{this.state.loc}</Text>
        </View>
        <Page.Intro main="解析 search " />
        <View style={styles.resultLine}>
          <Text style={styles.resultLabel}>search 字符串值</Text>
          <Text style={styles.resultText}>{this.state.search}</Text>
        </View>
        <View style={styles.resultLine}>
          <Text style={styles.resultLabel}>id</Text>
          <Text style={styles.resultText}>id:{this.state.id}</Text>
        </View>
        <View style={styles.resultLine}>
          <Text style={styles.resultLabel}>type</Text>
          <Text style={styles.resultText}>{this.state.type}</Text>
        </View>
      </Page>
    );
  }
};

const styles = {
  resultLine: {
    minHeight: '80rem',
    margin: '30rem',
    padding: '10rem',
    backgroundColor: '#ffffff',
    justifyContent: 'center'
    // alignItems:'center'
  },
  resultLabel: {
    fontSize: '28rem',
    color: '#bbbbbb'
  },
  resultText: {
    fontSize: '28rem',
    marginBottom: '20rem'
  }
};
render(<App />);
```