Updated example to use ES6 features

Used imports instead of require.
Simplified imports and removed unused component View.
Background is now a const instead of var. <- ES6 prefers this
Removed dangling comma after background ```source={{uri: background, }}```

Generally example is more succinct and easier to understand for users only exposed to the new tools of ES6.
This commit is contained in:
Michael Hancock 2016-07-01 09:12:28 +01:00 committed by GitHub
parent cd10c4d842
commit 47dfe40b6a
1 changed files with 6 additions and 15 deletions

View File

@ -1,17 +1,11 @@
var React = require('react'); import React, {Component} from 'react';
var { import {
Component,
PropTypes
} = React;
var ReactNative = require('react-native');
var {
AppRegistry, AppRegistry,
StyleSheet, StyleSheet,
Text, Text,
View,
Image, Image,
} = ReactNative; } from 'react-native';
import {BlurView, VibrancyView} from 'react-native-blur';
const styles = StyleSheet.create({ const styles = StyleSheet.create({
container: { container: {
@ -27,15 +21,12 @@ const styles = StyleSheet.create({
}, },
}); });
var BlurView = require('react-native-blur').BlurView; const background = 'http://iphonewallpapers-hd.com/thumbs/firework_iphone_wallpaper_5-t2.jpg';
var VibrancyView = require('react-native-blur').VibrancyView;
var background = 'http://iphonewallpapers-hd.com/thumbs/firework_iphone_wallpaper_5-t2.jpg';
class Basic extends Component { class Basic extends Component {
render() { render() {
return ( return (
<Image source={{uri: background, }} style={styles.container}> <Image source={{uri: background}} style={styles.container}>
<BlurView blurType="light" style={styles.container}> <BlurView blurType="light" style={styles.container}>
<Text style={styles.welcome}>Blur component</Text> <Text style={styles.welcome}>Blur component</Text>
</BlurView> </BlurView>