mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Updated docs for next
This commit is contained in:
Website Deployment Script
@@ -190,13 +190,14 @@ MapView<span class="token punctuation">.</span>propTypes <span class="token oper
|
||||
</span>
|
||||
class <span class="token class-name">MapView</span> extends <span class="token class-name">React<span class="token punctuation">.</span>Component</span> <span class="token punctuation">{</span>
|
||||
<span class="token function">constructor<span class="token punctuation">(</span></span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
<span class="token function">super<span class="token punctuation">(</span></span>props<span class="token punctuation">)</span>
|
||||
<span class="token keyword">this</span><span class="token punctuation">.</span>_onChange <span class="token operator">=</span> <span class="token keyword">this</span><span class="token punctuation">.</span>_onChange<span class="token punctuation">.</span><span class="token function">bind<span class="token punctuation">(</span></span><span class="token keyword">this</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token punctuation">}</span>
|
||||
<span class="token function">_onChange<span class="token punctuation">(</span></span>event<span class="token punctuation">:</span> Event<span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token operator">!</span><span class="token keyword">this</span><span class="token punctuation">.</span>props<span class="token punctuation">.</span>onRegionChange<span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">return</span><span class="token punctuation">;</span>
|
||||
<span class="token punctuation">}</span>
|
||||
<span class="token keyword">this</span><span class="token punctuation">.</span>props<span class="token punctuation">.</span><span class="token function">onRegionChange<span class="token punctuation">(</span></span>event<span class="token punctuation">.</span>nativeEvent<span class="token punctuation">.</span>region<span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token keyword">this</span><span class="token punctuation">.</span>props<span class="token punctuation">.</span><span class="token function">onRegionChange<span class="token punctuation">(</span></span>event<span class="token punctuation">.</span>nativeEvent<span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token punctuation">}</span>
|
||||
<span class="token function">render<span class="token punctuation">(</span></span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">return</span> <RNTMap <span class="token punctuation">{</span><span class="token punctuation">.</span><span class="token punctuation">.</span><span class="token punctuation">.</span><span class="token keyword">this</span><span class="token punctuation">.</span>props<span class="token punctuation">}</span> onChange<span class="token operator">=</span><span class="token punctuation">{</span><span class="token keyword">this</span><span class="token punctuation">.</span>_onChange<span class="token punctuation">}</span> <span class="token operator">/</span><span class="token operator">></span><span class="token punctuation">;</span>
|
||||
@@ -206,9 +207,31 @@ MapView<span class="token punctuation">.</span>propTypes <span class="token oper
|
||||
<span class="token comment" spellcheck="true">/**
|
||||
* Callback that is called continuously when the user is dragging the map.
|
||||
*/</span>
|
||||
onRegionChange<span class="token punctuation">:</span> React<span class="token punctuation">.</span>PropTypes<span class="token punctuation">.</span>func<span class="token punctuation">,</span>
|
||||
onChange<span class="token punctuation">:</span> React<span class="token punctuation">.</span>PropTypes<span class="token punctuation">.</span>func<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><h2><a class="anchor" name="styles"></a>Styles <a class="hash-link" href="docs/native-components-ios.html#styles">#</a></h2><p>Since all our native react views are subclasses of <code>UIView</code>, most style attributes will work like you would expect out of the box. Some components will want a default style, however, for example <code>UIDatePicker</code> which is a fixed size. This default style is important for the layout algorithm to work as expected, but we also want to be able to override the default style when using the component. <code>DatePickerIOS</code> does this by wrapping the native component in an extra view, which has flexible styling, and using a fixed style (which is generated with constants passed in from native) on the inner native component:</p><div class="prism language-javascript"><span class="token comment" spellcheck="true">// DatePickerIOS.ios.js
|
||||
<span class="token punctuation">}</span><span class="token punctuation">;</span>
|
||||
|
||||
class <span class="token class-name">MapViewExample</span> extends <span class="token class-name">React<span class="token punctuation">.</span>Component</span> <span class="token punctuation">{</span>
|
||||
<span class="token function">onRegionChange<span class="token punctuation">(</span></span>event<span class="token punctuation">:</span> Event<span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
<span class="token comment" spellcheck="true"> // Do stuff with event.region.latitude, etc.
|
||||
</span> <span class="token punctuation">}</span>
|
||||
|
||||
<span class="token function">render<span class="token punctuation">(</span></span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">var</span> region <span class="token operator">=</span> <span class="token punctuation">{</span>
|
||||
latitude<span class="token punctuation">:</span> <span class="token number">37.48</span><span class="token punctuation">,</span>
|
||||
longitude<span class="token punctuation">:</span> <span class="token operator">-</span><span class="token number">122.16</span><span class="token punctuation">,</span>
|
||||
latitudeDelta<span class="token punctuation">:</span> <span class="token number">0.1</span><span class="token punctuation">,</span>
|
||||
longitudeDelta<span class="token punctuation">:</span> <span class="token number">0.1</span><span class="token punctuation">,</span>
|
||||
<span class="token punctuation">}</span><span class="token punctuation">;</span>
|
||||
|
||||
<span class="token keyword">return</span> <span class="token punctuation">(</span>
|
||||
<MapView region<span class="token operator">=</span><span class="token punctuation">{</span>region<span class="token punctuation">}</span> pitchEnabled<span class="token operator">=</span><span class="token punctuation">{</span><span class="token boolean">false</span><span class="token punctuation">}</span> style<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>flex<span class="token punctuation">:</span> <span class="token number">1</span><span class="token punctuation">}</span><span class="token punctuation">}</span> onChange<span class="token operator">=</span><span class="token punctuation">{</span><span class="token keyword">this</span><span class="token punctuation">.</span>onRegionChange<span class="token punctuation">}</span><span class="token operator">/</span><span class="token operator">></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">
|
||||
// Module name
|
||||
</span>AppRegistry<span class="token punctuation">.</span><span class="token function">registerComponent<span class="token punctuation">(</span></span><span class="token string">'MapViewExample'</span><span class="token punctuation">,</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span> MapViewExample<span class="token punctuation">)</span><span class="token punctuation">;</span></div><h2><a class="anchor" name="styles"></a>Styles <a class="hash-link" href="docs/native-components-ios.html#styles">#</a></h2><p>Since all our native react views are subclasses of <code>UIView</code>, most style attributes will work like you would expect out of the box. Some components will want a default style, however, for example <code>UIDatePicker</code> which is a fixed size. This default style is important for the layout algorithm to work as expected, but we also want to be able to override the default style when using the component. <code>DatePickerIOS</code> does this by wrapping the native component in an extra view, which has flexible styling, and using a fixed style (which is generated with constants passed in from native) on the inner native component:</p><div class="prism language-javascript"><span class="token comment" spellcheck="true">// DatePickerIOS.ios.js
|
||||
</span>
|
||||
import <span class="token punctuation">{</span> UIManager <span class="token punctuation">}</span> from <span class="token string">'react-native'</span><span class="token punctuation">;</span>
|
||||
<span class="token keyword">var</span> RCTDatePickerIOSConsts <span class="token operator">=</span> UIManager<span class="token punctuation">.</span>RCTDatePicker<span class="token punctuation">.</span>Constants<span class="token punctuation">;</span>
|
||||
|
||||
@@ -25,7 +25,53 @@
|
||||
<span class="token punctuation">}</span> <span class="token keyword">catch</span><span class="token punctuation">(</span>error<span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
console<span class="token punctuation">.</span><span class="token function">error<span class="token punctuation">(</span></span>error<span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token punctuation">}</span>
|
||||
<span class="token punctuation">}</span></div><p>Don't forget to catch any errors that may be thrown by <code>fetch</code>, otherwise they will be dropped silently.</p><blockquote><p>By default, iOS will block any request that's not encrypted using SSL. If you need to fetch from a cleartext URL (one that begins with <code>http</code>) you will first need to add an App Transport Security exception. If you know ahead of time what domains you will need access to, it is more secure to add exceptions just for those domains; if the domains are not known until runtime you can <a href="docs/integration-with-existing-apps.html#app-transport-security" target="_blank">disable ATS completely</a>. Note however that from January 2017, <a href="https://forums.developer.apple.com/thread/48979" target="_blank">Apple's App Store review will require reasonable justification for disabling ATS</a>. See <a href="https://developer.apple.com/library/ios/documentation/General/Reference/InfoPlistKeyReference/Articles/CocoaKeys.html#//apple_ref/doc/uid/TP40009251-SW33" target="_blank">Apple's documentation</a> for more information.</p></blockquote><h3><a class="anchor" name="using-other-networking-libraries"></a>Using Other Networking Libraries <a class="hash-link" href="docs/network.html#using-other-networking-libraries">#</a></h3><p>The <a href="https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest" target="_blank">XMLHttpRequest API</a> is built in to React Native. This means that you can use third party libraries such as <a href="https://github.com/niftylettuce/frisbee" target="_blank">frisbee</a> or <a href="https://github.com/mzabriskie/axios" target="_blank">axios</a> that depend on it, or you can use the XMLHttpRequest API directly if you prefer.</p><div class="prism language-javascript"><span class="token keyword">var</span> request <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">XMLHttpRequest</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token punctuation">}</span></div><p>Don't forget to catch any errors that may be thrown by <code>fetch</code>, otherwise they will be dropped silently.</p><div class="snack-player"><div class="mobile-friendly-snack" style="display:none;"><div class="prism language-javascript">import React<span class="token punctuation">,</span> <span class="token punctuation">{</span> Component <span class="token punctuation">}</span> from <span class="token string">'react'</span><span class="token punctuation">;</span>
|
||||
import <span class="token punctuation">{</span> ActivityIndicator<span class="token punctuation">,</span> ListView<span class="token punctuation">,</span> Text<span class="token punctuation">,</span> View <span class="token punctuation">}</span> from <span class="token string">'react-native'</span><span class="token punctuation">;</span>
|
||||
|
||||
export default class <span class="token class-name">Movies</span> extends <span class="token class-name">Component</span> <span class="token punctuation">{</span>
|
||||
<span class="token function">constructor<span class="token punctuation">(</span></span>props<span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
<span class="token function">super<span class="token punctuation">(</span></span>props<span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token keyword">this</span><span class="token punctuation">.</span>state <span class="token operator">=</span> <span class="token punctuation">{</span>
|
||||
isLoading<span class="token punctuation">:</span> <span class="token boolean">true</span>
|
||||
<span class="token punctuation">}</span>
|
||||
<span class="token punctuation">}</span>
|
||||
|
||||
<span class="token function">componentDidMount<span class="token punctuation">(</span></span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">return</span> <span class="token function">fetch<span class="token punctuation">(</span></span><span class="token string">'https://facebook.github.io/react-native/movies.json'</span><span class="token punctuation">)</span>
|
||||
<span class="token punctuation">.</span><span class="token function">then<span class="token punctuation">(</span></span><span class="token punctuation">(</span>response<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span> response<span class="token punctuation">.</span><span class="token function">json<span class="token punctuation">(</span></span><span class="token punctuation">)</span><span class="token punctuation">)</span>
|
||||
<span class="token punctuation">.</span><span class="token function">then<span class="token punctuation">(</span></span><span class="token punctuation">(</span>responseJson<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">let</span> ds <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">ListView<span class="token punctuation">.</span>DataSource</span><span class="token punctuation">(</span><span class="token punctuation">{</span>rowHasChanged<span class="token punctuation">:</span> <span class="token punctuation">(</span>r1<span class="token punctuation">,</span> r2<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span> r1 <span class="token operator">!</span><span class="token operator">==</span> r2<span class="token punctuation">}</span><span class="token punctuation">)</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>
|
||||
isLoading<span class="token punctuation">:</span> <span class="token boolean">false</span><span class="token punctuation">,</span>
|
||||
dataSource<span class="token punctuation">:</span> ds<span class="token punctuation">.</span><span class="token function">cloneWithRows<span class="token punctuation">(</span></span>responseJson<span class="token punctuation">.</span>movies<span class="token punctuation">)</span><span class="token punctuation">,</span>
|
||||
<span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
<span class="token comment" spellcheck="true"> // do something with new state
|
||||
</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>
|
||||
<span class="token punctuation">.</span><span class="token keyword">catch</span><span class="token punctuation">(</span><span class="token punctuation">(</span>error<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span> <span class="token punctuation">{</span>
|
||||
console<span class="token punctuation">.</span><span class="token function">error<span class="token punctuation">(</span></span>error<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>
|
||||
|
||||
<span class="token function">render<span class="token punctuation">(</span></span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token keyword">this</span><span class="token punctuation">.</span>state<span class="token punctuation">.</span>isLoading<span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">return</span> <span class="token punctuation">(</span>
|
||||
<View style<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>flex<span class="token punctuation">:</span> <span class="token number">1</span><span class="token punctuation">,</span> paddingTop<span class="token punctuation">:</span> <span class="token number">20</span><span class="token punctuation">}</span><span class="token punctuation">}</span><span class="token operator">></span>
|
||||
<ActivityIndicator <span class="token operator">/</span><span class="token operator">></span>
|
||||
<<span class="token operator">/</span>View<span class="token operator">></span>
|
||||
<span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token punctuation">}</span>
|
||||
|
||||
<span class="token keyword">return</span> <span class="token punctuation">(</span>
|
||||
<View style<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>flex<span class="token punctuation">:</span> <span class="token number">1</span><span class="token punctuation">,</span> paddingTop<span class="token punctuation">:</span> <span class="token number">20</span><span class="token punctuation">}</span><span class="token punctuation">}</span><span class="token operator">></span>
|
||||
<ListView
|
||||
dataSource<span class="token operator">=</span><span class="token punctuation">{</span><span class="token keyword">this</span><span class="token punctuation">.</span>state<span class="token punctuation">.</span>dataSource<span class="token punctuation">}</span>
|
||||
renderRow<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">(</span>rowData<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span> <Text<span class="token operator">></span><span class="token punctuation">{</span>rowData<span class="token punctuation">.</span>title<span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token punctuation">{</span>rowData<span class="token punctuation">.</span>releaseYear<span class="token punctuation">}</span><<span class="token operator">/</span>Text<span class="token operator">></span><span class="token punctuation">}</span>
|
||||
<span class="token operator">/</span><span class="token operator">></span>
|
||||
<<span class="token operator">/</span>View<span class="token operator">></span>
|
||||
<span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token punctuation">}</span>
|
||||
<span class="token punctuation">}</span></div></div><div class="desktop-friendly-snack" style="margin-top:15px;margin-bottom:15px;"><div data-snack-name="Fetch Example" data-snack-description="Example usage" data-snack-code="import%20React%2C%20%7B%20Component%20%7D%20from%20'react'%3B%0Aimport%20%7B%20ActivityIndicator%2C%20ListView%2C%20Text%2C%20View%20%7D%20from%20'react-native'%3B%0A%0Aexport%20default%20class%20Movies%20extends%20Component%20%7B%0A%20%20constructor(props)%20%7B%0A%20%20%20%20super(props)%3B%0A%20%20%20%20this.state%20%3D%20%7B%0A%20%20%20%20%20%20isLoading%3A%20true%0A%20%20%20%20%7D%0A%20%20%7D%0A%0A%20%20componentDidMount()%20%7B%0A%20%20%20%20return%20fetch('https%3A%2F%2Ffacebook.github.io%2Freact-native%2Fmovies.json')%0A%20%20%20%20%20%20.then((response)%20%3D%3E%20response.json())%0A%20%20%20%20%20%20.then((responseJson)%20%3D%3E%20%7B%0A%20%20%20%20%20%20%20%20let%20ds%20%3D%20new%20ListView.DataSource(%7BrowHasChanged%3A%20(r1%2C%20r2)%20%3D%3E%20r1%20!%3D%3D%20r2%7D)%3B%0A%20%20%20%20%20%20%20%20this.setState(%7B%0A%20%20%20%20%20%20%20%20%20%20isLoading%3A%20false%2C%0A%20%20%20%20%20%20%20%20%20%20dataSource%3A%20ds.cloneWithRows(responseJson.movies)%2C%0A%20%20%20%20%20%20%20%20%7D%2C%20function()%20%7B%0A%20%20%20%20%20%20%20%20%20%20%2F%2F%20do%20something%20with%20new%20state%0A%20%20%20%20%20%20%20%20%7D)%3B%0A%20%20%20%20%20%20%7D)%0A%20%20%20%20%20%20.catch((error)%20%3D%3E%20%7B%0A%20%20%20%20%20%20%20%20console.error(error)%3B%0A%20%20%20%20%20%20%7D)%3B%0A%20%20%7D%0A%0A%20%20render()%20%7B%0A%20%20%20%20if%20(this.state.isLoading)%20%7B%0A%20%20%20%20%20%20return%20(%0A%20%20%20%20%20%20%20%20%3CView%20style%3D%7B%7Bflex%3A%201%2C%20paddingTop%3A%2020%7D%7D%3E%0A%20%20%20%20%20%20%20%20%20%20%3CActivityIndicator%20%2F%3E%0A%20%20%20%20%20%20%20%20%3C%2FView%3E%0A%20%20%20%20%20%20)%3B%0A%20%20%20%20%7D%0A%0A%20%20%20%20return%20(%0A%20%20%20%20%20%20%3CView%20style%3D%7B%7Bflex%3A%201%2C%20paddingTop%3A%2020%7D%7D%3E%0A%20%20%20%20%20%20%20%20%3CListView%0A%20%20%20%20%20%20%20%20%20%20dataSource%3D%7Bthis.state.dataSource%7D%0A%20%20%20%20%20%20%20%20%20%20renderRow%3D%7B(rowData)%20%3D%3E%20%3CText%3E%7BrowData.title%7D%2C%20%7BrowData.releaseYear%7D%3C%2FText%3E%7D%0A%20%20%20%20%20%20%20%20%2F%3E%0A%20%20%20%20%20%20%3C%2FView%3E%0A%20%20%20%20)%3B%0A%20%20%7D%0A%7D" data-snack-platform="ios" data-snack-preview="true" data-snack-sdk-version="15.0.0" style="overflow:hidden;background:#fafafa;border:1px solid rgba(0,0,0,.16);border-radius:4px;height:514px;width:880px;"></div></div></div><blockquote><p>By default, iOS will block any request that's not encrypted using SSL. If you need to fetch from a cleartext URL (one that begins with <code>http</code>) you will first need to add an App Transport Security exception. If you know ahead of time what domains you will need access to, it is more secure to add exceptions just for those domains; if the domains are not known until runtime you can <a href="docs/integration-with-existing-apps.html#app-transport-security" target="_blank">disable ATS completely</a>. Note however that from January 2017, <a href="https://forums.developer.apple.com/thread/48979" target="_blank">Apple's App Store review will require reasonable justification for disabling ATS</a>. See <a href="https://developer.apple.com/library/ios/documentation/General/Reference/InfoPlistKeyReference/Articles/CocoaKeys.html#//apple_ref/doc/uid/TP40009251-SW33" target="_blank">Apple's documentation</a> for more information.</p></blockquote><h3><a class="anchor" name="using-other-networking-libraries"></a>Using Other Networking Libraries <a class="hash-link" href="docs/network.html#using-other-networking-libraries">#</a></h3><p>The <a href="https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest" target="_blank">XMLHttpRequest API</a> is built in to React Native. This means that you can use third party libraries such as <a href="https://github.com/niftylettuce/frisbee" target="_blank">frisbee</a> or <a href="https://github.com/mzabriskie/axios" target="_blank">axios</a> that depend on it, or you can use the XMLHttpRequest API directly if you prefer.</p><div class="prism language-javascript"><span class="token keyword">var</span> request <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">XMLHttpRequest</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
request<span class="token punctuation">.</span>onreadystatechange <span class="token operator">=</span> <span class="token punctuation">(</span>e<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">if</span> <span class="token punctuation">(</span>request<span class="token punctuation">.</span>readyState <span class="token operator">!</span><span class="token operator">==</span> <span class="token number">4</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">return</span><span class="token punctuation">;</span>
|
||||
|
||||
@@ -11,8 +11,7 @@
|
||||
|
||||
</span><p>Handle push notifications for your app, including permission handling and
|
||||
icon badge number.</p><p>To get up and running, <a href="https://developer.apple.com/library/ios/documentation/IDEs/Conceptual/AppDistributionGuide/AddingCapabilities/AddingCapabilities.html#//apple_ref/doc/uid/TP40012582-CH26-SW6" target="_blank">configure your notifications with Apple</a>
|
||||
and your server-side system.</p><p><a href="docs/linking-libraries-ios.html#manual-linking" target="_blank">Manually link</a> the PushNotificationIOS library</p><ul><li>Add the following to your Project: <code>node_modules/react-native/Libraries/PushNotificationIOS/RCTPushNotification.xcodeproj</code></li><li>Add the following to <code>Link Binary With Libraries</code>: <code>libRCTPushNotification.a</code></li><li>Add the following to your <code>Header Search Paths</code>:
|
||||
<code>$(SRCROOT)/../node_modules/react-native/Libraries/PushNotificationIOS</code> and set the search to <code>recursive</code></li></ul><p>Finally, to enable support for <code>notification</code> and <code>register</code> events you need to augment your AppDelegate.</p><p>At the top of your <code>AppDelegate.m</code>:</p><p> <code>#import "RCTPushNotificationManager.h"</code></p><p>And then in your AppDelegate implementation add the following:</p><div class="prism language-javascript"> <span class="token comment" spellcheck="true"> // Required to register for notifications
|
||||
and your server-side system.</p><p><a href="docs/linking-libraries-ios.html#manual-linking" target="_blank">Manually link</a> the PushNotificationIOS library</p><ul><li>Add the following to your Project: <code>node_modules/react-native/Libraries/PushNotificationIOS/RCTPushNotification.xcodeproj</code></li><li>Add the following to <code>Link Binary With Libraries</code>: <code>libRCTPushNotification.a</code></li></ul><p>Finally, to enable support for <code>notification</code> and <code>register</code> events you need to augment your AppDelegate.</p><p>At the top of your <code>AppDelegate.m</code>:</p><p> <code>#import <React/RCTPushNotificationManager.h></code></p><p>And then in your AppDelegate implementation add the following:</p><div class="prism language-javascript"> <span class="token comment" spellcheck="true"> // Required to register for notifications
|
||||
</span> <span class="token operator">-</span> <span class="token punctuation">(</span>void<span class="token punctuation">)</span>application<span class="token punctuation">:</span><span class="token punctuation">(</span>UIApplication <span class="token operator">*</span><span class="token punctuation">)</span>application didRegisterUserNotificationSettings<span class="token punctuation">:</span><span class="token punctuation">(</span>UIUserNotificationSettings <span class="token operator">*</span><span class="token punctuation">)</span>notificationSettings
|
||||
<span class="token punctuation">{</span>
|
||||
<span class="token punctuation">[</span>RCTPushNotificationManager didRegisterUserNotificationSettings<span class="token punctuation">:</span>notificationSettings<span class="token punctuation">]</span><span class="token punctuation">;</span>
|
||||
|
||||
Reference in New Issue
Block a user