{"id":490,"date":"2023-02-25T14:08:43","date_gmt":"2023-02-25T06:08:43","guid":{"rendered":"https:\/\/www.appblog.cn\/?p=490"},"modified":"2023-04-29T20:51:05","modified_gmt":"2023-04-29T12:51:05","slug":"react-native-learning-picker-component-and-arrow-function","status":"publish","type":"post","link":"https:\/\/www.appblog.cn\/index.php\/2023\/02\/25\/react-native-learning-picker-component-and-arrow-function\/","title":{"rendered":"React Native\u5b66\u4e60\u4e4bPicker\u7ec4\u4ef6\u548c\u7bad\u5934\u51fd\u6570"},"content":{"rendered":"<p>\u672c\u7ec4\u4ef6\u53ef\u4ee5\u5728iOS\u548cAndroid\u4e0a\u6e32\u67d3\u539f\u751f\u7684\u9009\u62e9\u5668\uff08Picker\uff09<\/p>\n<h2>Picker\u7ec4\u4ef6\u7684\u5c5e\u6027<\/h2>\n<ul>\n<li>mode\uff1a\u9009\u62e9\u5668\u7684\u6837\u5f0f\uff0c\u5305\u62ec<code>dialog<\/code>\u3001<code>dropdown<\/code><\/li>\n<\/ul>\n<p><!-- more --><\/p>\n<h2>\u7bad\u5934\u51fd\u6570<\/h2>\n<pre><code class=\"language-javascript\">\/\/\u65e0\u53c2\u6570 =&gt; \u51fd\u6570\u4f53\n() =&gt; {\n    return 0;\n}\n\n\/\/\u5e26\u53c2\u6570 =&gt; \u51fd\u6570\u4f53\n(param1, param2) =&gt; {\n    return 0;\n}\n\n\/\/\u5e26\u53c2\u6570 =&gt; \u8868\u8fbe\u5f0f\nparam =&gt; this.setState({language: param})\n\n\/\/\u65e0\u53c2\u6570 =&gt; \u53d8\u91cf\n() =&gt; value<\/code><\/pre>\n<pre><code class=\"language-javascript\">\/**\n * Sample React Native App\n * https:\/\/github.com\/facebook\/react-native\n *\/\n&#039;use strict&#039;;\n\nimport React, { Component } from &#039;react&#039;;\nimport {\n    AppRegistry,\n    StyleSheet,\n    PixelRatio,\n    Text,\n    Image,\n    TouchableOpacity,\n    Picker,\n    View\n} from &#039;react-native&#039;;\n\nclass RNAPP extends Component {\n    constructor(props) {\n        super(props);\n        this.state = {\n            language: null\n        };\n    }\n\n    \/\/\u7bad\u5934\u51fd\u6570 ES6\u8bed\u6cd5\n\n    render() {\n        return (\n            &lt;View style={[styles.flex, {marginTop:45}]}&gt;\n                &lt;Text&gt;Picker\u7ec4\u4ef6&lt;\/Text&gt;\n\n                &lt;Picker\n                    selectedValue={this.state.language}\n                    onValueChange={lang =&gt; this.setState({language: lang})}\n                    mode=&quot;dialog&quot;\n                    style={{color:&#039;#f00&#039;}}\n                    &gt;\n\n                    &lt;Picker.Item label=&quot;Java&quot; value=&quot;java&quot; \/&gt;\n                    &lt;Picker.Item label=&quot;JavaScript&quot; value=&quot;js&quot; \/&gt;\n                    &lt;Picker.Item label=&quot;C\u8bed\u8a00&quot; value=&quot;c&quot; \/&gt;\n                    &lt;Picker.Item label=&quot;PHP\u5f00\u53d1&quot; value=&quot;php&quot; \/&gt;\n                    &lt;Picker.Item label=&quot;Swift&quot; value=&quot;swift&quot; \/&gt;\n                &lt;\/Picker&gt;\n\n                &lt;Text&gt;{this.state.language}&lt;\/Text&gt;\n            &lt;\/View&gt;\n        );\n    }\n}\n\nconst styles = StyleSheet.create({\n    flex:{\n        flex:1,\n    },\n});\n\nAppRegistry.registerComponent(&#039;RNAPP&#039;, () =&gt; RNAPP);<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>\u672c\u7ec4\u4ef6\u53ef\u4ee5\u5728iOS\u548cAndroid\u4e0a\u6e32\u67d3\u539f\u751f\u7684\u9009\u62e9\u5668\uff08Picker\uff09 Picker\u7ec4\u4ef6\u7684\u5c5e\u6027 mode\uff1a\u9009\u62e9\u5668 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[163],"tags":[],"class_list":["post-490","post","type-post","status-publish","format-standard","hentry","category-react-native"],"_links":{"self":[{"href":"https:\/\/www.appblog.cn\/index.php\/wp-json\/wp\/v2\/posts\/490","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.appblog.cn\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.appblog.cn\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.appblog.cn\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.appblog.cn\/index.php\/wp-json\/wp\/v2\/comments?post=490"}],"version-history":[{"count":0,"href":"https:\/\/www.appblog.cn\/index.php\/wp-json\/wp\/v2\/posts\/490\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.appblog.cn\/index.php\/wp-json\/wp\/v2\/media?parent=490"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.appblog.cn\/index.php\/wp-json\/wp\/v2\/categories?post=490"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.appblog.cn\/index.php\/wp-json\/wp\/v2\/tags?post=490"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}