mirror of
https://github.com/zhigang1992/react-native.git
synced 2026-02-06 22:44:22 +08:00
Updates from Tue Mar 10
- [ReactNative] Make tests run on TravisCI | Alex Kotliarskyi - [Relay] Update Relay + ES6 class containers | Christoph Pojer - [React Native] Add RCTAdSupport.xcodeproj | Alexsander Akers - [ReactNative][Android] Fix after a new React version was downstreamed | Philipp von Weitershausen - [React Native] Add preliminary animation API | Alex Akers - [ReactKit] Create test for OSS ReactKit | Alex Kotliarskyi - [React Native][Device ID][wip] implement most basic js access | Alex Akers - [ReactNative] OSS Picker | Spencer Ahrens - [ReactNative] Fix typo in RCTUIManager | Tadeu Zagallo - [ReactNative] Fix GeoLocation files letter case | Tadeu Zagallo - Unified the method signature for addUIBlock: to further simplify porting ViewManagers | Nick Lockwood - [ReactNative] Oss GeoMap | Tadeu Zagallo - [ReactNative] OSS CameraRoll | Tadeu Zagallo - [ReactNative] allowLossyConversion on NSString->NSData conversion | Andrew Rasmussen - [React Native][RFC] Print __DEV__ value on app start | Alex Kotliarskyi
This commit is contained in:
113
Examples/UIExplorer/PickerExample.js
Normal file
113
Examples/UIExplorer/PickerExample.js
Normal file
@@ -0,0 +1,113 @@
|
||||
/**
|
||||
* Copyright 2004-present Facebook. All Rights Reserved.
|
||||
*
|
||||
* @providesModule PickerExample
|
||||
*/
|
||||
'use strict';
|
||||
|
||||
var React = require('react-native');
|
||||
var {
|
||||
PickerIOS,
|
||||
Text,
|
||||
View,
|
||||
} = React;
|
||||
|
||||
var PickerItemIOS = PickerIOS.Item;
|
||||
|
||||
var CAR_MAKES_AND_MODELS = {
|
||||
amc: {
|
||||
name: 'AMC',
|
||||
models: ['AMX', 'Concord', 'Eagle', 'Gremlin', 'Matador', 'Pacer'],
|
||||
},
|
||||
alfa: {
|
||||
name: 'Alfa-Romeo',
|
||||
models: ['159', '4C', 'Alfasud', 'Brera', 'GTV6', 'Giulia', 'MiTo', 'Spider'],
|
||||
},
|
||||
aston: {
|
||||
name: 'Aston Martin',
|
||||
models: ['DB5', 'DB9', 'DBS', 'Rapide', 'Vanquish', 'Vantage'],
|
||||
},
|
||||
audi: {
|
||||
name: 'Audi',
|
||||
models: ['90', '4000', '5000', 'A3', 'A4', 'A5', 'A6', 'A7', 'A8', 'Q5', 'Q7'],
|
||||
},
|
||||
austin: {
|
||||
name: 'Austin',
|
||||
models: ['America', 'Maestro', 'Maxi', 'Mini', 'Montego', 'Princess'],
|
||||
},
|
||||
borgward: {
|
||||
name: 'Borgward',
|
||||
models: ['Hansa', 'Isabella', 'P100'],
|
||||
},
|
||||
buick: {
|
||||
name: 'Buick',
|
||||
models: ['Electra', 'LaCrosse', 'LeSabre', 'Park Avenue', 'Regal',
|
||||
'Roadmaster', 'Skylark'],
|
||||
},
|
||||
cadillac: {
|
||||
name: 'Cadillac',
|
||||
models: ['Catera', 'Cimarron', 'Eldorado', 'Fleetwood', 'Sedan de Ville'],
|
||||
},
|
||||
chevrolet: {
|
||||
name: 'Chevrolet',
|
||||
models: ['Astro', 'Aveo', 'Bel Air', 'Captiva', 'Cavalier', 'Chevelle',
|
||||
'Corvair', 'Corvette', 'Cruze', 'Nova', 'SS', 'Vega', 'Volt'],
|
||||
},
|
||||
};
|
||||
|
||||
var PickerExample = React.createClass({
|
||||
getInitialState: function() {
|
||||
return {
|
||||
carMake: 'cadillac',
|
||||
modelIndex: 3,
|
||||
};
|
||||
},
|
||||
|
||||
render: function() {
|
||||
var make = CAR_MAKES_AND_MODELS[this.state.carMake];
|
||||
var selectionString = make.name + ' ' + make.models[this.state.modelIndex];
|
||||
return (
|
||||
<View>
|
||||
<Text>Please choose a make for your car:</Text>
|
||||
<PickerIOS
|
||||
selectedValue={this.state.carMake}
|
||||
onValueChange={(carMake) => this.setState({carMake, modelIndex: 0})}>
|
||||
{Object.keys(CAR_MAKES_AND_MODELS).map((carMake) => (
|
||||
<PickerItemIOS
|
||||
key={carMake}
|
||||
value={carMake}
|
||||
label={CAR_MAKES_AND_MODELS[carMake].name}
|
||||
/>
|
||||
)
|
||||
)}
|
||||
</PickerIOS>
|
||||
<Text>Please choose a model of {make.name}:</Text>
|
||||
<PickerIOS
|
||||
selectedValue={this.state.modelIndex}
|
||||
key={this.state.carMake}
|
||||
onValueChange={(modelIndex) => this.setState({modelIndex})}>
|
||||
{CAR_MAKES_AND_MODELS[this.state.carMake].models.map(
|
||||
(modelName, modelIndex) => (
|
||||
<PickerItemIOS
|
||||
key={this.state.carmake + '_' + modelIndex}
|
||||
value={modelIndex}
|
||||
label={modelName}
|
||||
/>
|
||||
))
|
||||
}
|
||||
</PickerIOS>
|
||||
<Text>You selected: {selectionString}</Text>
|
||||
</View>
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
exports.title = '<PickerIOS>';
|
||||
exports.description = 'Render lists of selectable options with UIPickerView.';
|
||||
exports.examples = [
|
||||
{
|
||||
title: '<PickerIOS>',
|
||||
render: function() {
|
||||
return <PickerExample />;
|
||||
},
|
||||
}];
|
||||
Reference in New Issue
Block a user