mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
update website
This commit is contained in:
@@ -25,7 +25,7 @@ CalendarManager<span class="token punctuation">.</span><span class="token functi
|
||||
location<span class="token punctuation">:</span> <span class="token string">'4 Privet Drive, Surrey'</span><span class="token punctuation">,</span>
|
||||
time<span class="token punctuation">:</span> date<span class="token punctuation">.</span><span class="token function">toTime<span class="token punctuation">(</span></span><span class="token punctuation">)</span><span class="token punctuation">,</span>
|
||||
description<span class="token punctuation">:</span> <span class="token string">'...'</span>
|
||||
<span class="token punctuation">}</span><span class="token punctuation">)</span></div><p>NOTE about array and map - React Native doesn't provide any guarantees about the types of values in these structures. Your native module might expect array of strings, but if JavaScript calls your method with an array that contains number and string you'll get <code>NSArray</code> with <code>NSNumber</code> and <code>NSString</code>. It's developer's responsibility to check array/map values types (see <code>RCTConvert</code> for helper methods).</p><h1><a class="anchor" name="callbacks"></a>Callbacks <a class="hash-link" href="#callbacks">#</a></h1><p>WARNING: This section is even more experimental than others, we don't have a set of best practices around callbacks yet.</p><p>Native module also supports a special kind of argument - callback. In most cases it is used to provide function call result to JavaScript.</p><div class="prism language-javascript"><span class="token operator">-</span> <span class="token punctuation">(</span>void<span class="token punctuation">)</span>findEvents<span class="token punctuation">:</span><span class="token punctuation">(</span>RCTResponseSenderBlock<span class="token punctuation">)</span>callback
|
||||
<span class="token punctuation">}</span><span class="token punctuation">)</span></div><blockquote><p><strong>NOTE</strong>: About array and map</p><p>React Native doesn't provide any guarantees about the types of values in these structures. Your native module might expect array of strings, but if JavaScript calls your method with an array that contains number and string you'll get <code>NSArray</code> with <code>NSNumber</code> and <code>NSString</code>. It's developer's responsibility to check array/map values types (see <a href="https://github.com/facebook/react-native/blob/master/ReactKit/Base/RCTConvert.h" target="_blank"><code>RCTConvert</code></a> for helper methods).</p></blockquote><h1><a class="anchor" name="callbacks"></a>Callbacks <a class="hash-link" href="#callbacks">#</a></h1><blockquote><p><strong>WARNING</strong></p><p>This section is even more experimental than others, we don't have a set of best practices around callbacks yet.</p></blockquote><p>Native module also supports a special kind of argument - callback. In most cases it is used to provide function call result to JavaScript.</p><div class="prism language-javascript"><span class="token operator">-</span> <span class="token punctuation">(</span>void<span class="token punctuation">)</span>findEvents<span class="token punctuation">:</span><span class="token punctuation">(</span>RCTResponseSenderBlock<span class="token punctuation">)</span>callback
|
||||
<span class="token punctuation">{</span>
|
||||
<span class="token function">RCT_EXPORT<span class="token punctuation">(</span></span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
NSArray <span class="token operator">*</span>events <span class="token operator">=</span> <span class="token punctuation">.</span><span class="token punctuation">.</span><span class="token punctuation">.</span>
|
||||
@@ -36,7 +36,7 @@ CalendarManager<span class="token punctuation">.</span><span class="token functi
|
||||
<span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">setState<span class="token punctuation">(</span></span><span class="token punctuation">{</span>events<span class="token punctuation">:</span> events<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token punctuation">}</span>
|
||||
<span class="token punctuation">}</span><span class="token punctuation">)</span></div><p>Native module is supposed to invoke callback only once. It can, however, store the callback as an ivar and invoke it later. This pattern is often used to wrap iOS APIs that require delegate. See <code>RCTAlertManager</code>.</p><p>If you want to pass error-like object to JavaScript, use <code>RCTMakeError</code> from <code>RCTUtils.h</code>.</p><h2><a class="anchor" name="implementing-native-module"></a>Implementing native module <a class="hash-link" href="#implementing-native-module">#</a></h2><p>The native module should not have any assumptions about what thread it is being called on. React Native invokes native modules methods on a separate serial GCD queue, but this is an implementation detail and might change. If the native module needs to call main-thread-only iOS API, it should schedule the operation on the main queue:</p><div class="prism language-javascript"><span class="token operator">-</span> <span class="token punctuation">(</span>void<span class="token punctuation">)</span>addEventWithName<span class="token punctuation">:</span><span class="token punctuation">(</span>NSString <span class="token operator">*</span><span class="token punctuation">)</span>name callback<span class="token punctuation">:</span><span class="token punctuation">(</span>RCTResponseSenderBlock<span class="token punctuation">)</span>callback
|
||||
<span class="token punctuation">}</span><span class="token punctuation">)</span></div><p>Native module is supposed to invoke callback only once. It can, however, store the callback as an ivar and invoke it later. This pattern is often used to wrap iOS APIs that require delegate. See <a href="https://github.com/facebook/react-native/blob/master/ReactKit/Modules/RCTAlertManager.m" target="_blank"><code>RCTAlertManager</code></a>.</p><p>If you want to pass error-like object to JavaScript, use <code>RCTMakeError</code> from <a href="https://github.com/facebook/react-native/blob/master/ReactKit/Base/RCTUtils.h" target="_blank"><code>RCTUtils.h</code></a>.</p><h2><a class="anchor" name="implementing-native-module"></a>Implementing native module <a class="hash-link" href="#implementing-native-module">#</a></h2><p>The native module should not have any assumptions about what thread it is being called on. React Native invokes native modules methods on a separate serial GCD queue, but this is an implementation detail and might change. If the native module needs to call main-thread-only iOS API, it should schedule the operation on the main queue:</p><div class="prism language-javascript"><span class="token operator">-</span> <span class="token punctuation">(</span>void<span class="token punctuation">)</span>addEventWithName<span class="token punctuation">:</span><span class="token punctuation">(</span>NSString <span class="token operator">*</span><span class="token punctuation">)</span>name callback<span class="token punctuation">:</span><span class="token punctuation">(</span>RCTResponseSenderBlock<span class="token punctuation">)</span>callback
|
||||
<span class="token punctuation">{</span>
|
||||
<span class="token function">RCT_EXPORT<span class="token punctuation">(</span></span>addEvent<span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token function">dispatch_async<span class="token punctuation">(</span></span><span class="token function">dispatch_get_main_queue<span class="token punctuation">(</span></span><span class="token punctuation">)</span><span class="token punctuation">,</span> <span class="token operator">^</span><span class="token punctuation">{</span>
|
||||
@@ -59,7 +59,7 @@ CalendarManager<span class="token punctuation">.</span><span class="token functi
|
||||
<span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token punctuation">.</span><span class="token punctuation">.</span><span class="token punctuation">.</span><span class="token comment" spellcheck="true">
|
||||
// Don't forget to unsubscribe
|
||||
</span>subscription<span class="token punctuation">.</span><span class="token function">remove<span class="token punctuation">(</span></span><span class="token punctuation">)</span><span class="token punctuation">;</span></div><p>For more examples of sending events to JavaScript, see <code>RCTLocationObserver</code>.</p></div><div class="docs-prevnext"><a class="docs-next" href="activityindicatorios.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
|
||||
</span>subscription<span class="token punctuation">.</span><span class="token function">remove<span class="token punctuation">(</span></span><span class="token punctuation">)</span><span class="token punctuation">;</span></div><p>For more examples of sending events to JavaScript, see <a href="https://github.com/facebook/react-native/blob/master/Libraries/Geolocation/RCTLocationObserver.m" target="_blank"><code>RCTLocationObserver</code></a>.</p></div><div class="docs-prevnext"><a class="docs-next" href="activityindicatorios.html#content">Next →</a></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
|
||||
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||||
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
||||
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
||||
|
||||
Reference in New Issue
Block a user