4.2 如何使用Nuke UI

在上一章节，我们创建了一个 AwesomeProject 项目。

• 切换到 AwesomeProject

• 使用你喜爱的编辑器/IDE 打开 AwesomeProject/src/index.jsx，修改其中的代码：

'use strict';
import {createElement, Component} from 'weex-rx';
import {View, Text,Button} from 'nuke';
import {mount} from 'nuke-mounter';

class Demo extends Component {
    render() {
        return (
            <View style={styles.container}>
                <Text style={styles.welcome}>
                    欢迎来到千牛!
                </Text>
                <Button type="primary">你好</Button>
            </View>
        );
    }
}

const styles = {
    container: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#F5FCFF',
    },
    welcome: {
        fontSize: 20,
        textAlign: 'center',
        margin: 10,
    }

};

mount(<Demo />, 'body');

export default Demo;

• 运行qap debug 试试吧