From 29afb7e6e58676ff16633e431077946c90b26a5d Mon Sep 17 00:00:00 2001
From: Bobby <puppybytes@gmail.com>
Date: Tue, 26 Jan 2016 13:25:50 -0800
Subject: [PATCH] Update 12-context.md

Context was missing info on how to update the context after the initial render. Added a simple blurb and an example.

[Docs] 12-context.md code review changes
---
 docs/12-context.md | 32 ++++++++++++++++++++++++++++++++
 1 file changed, 32 insertions(+)

diff --git a/docs/12-context.md b/docs/12-context.md
index 1eafd089..4c647365 100644
--- a/docs/12-context.md
+++ b/docs/12-context.md
@@ -160,6 +160,38 @@ function Button(props, context) {
 Button.contextTypes = {color: React.PropTypes.string};
 ```
 
+## Updating context
+
+The `getChildContext` function will be called when the state or props changes. In order to update data in the context, trigger a local state update with `this.setState`. This will trigger a new context and changes will be received by the children.
+
+```javascript
+var MediaQuery = React.createClass({
+  getInitialState: function(){
+    return {type:'desktop'};
+  },
+  childContextTypes: {
+    type: React.PropTypes.string
+  },
+  getChildContext: function() {
+    return {type: this.state.type};
+  },
+  componentDidMount: function(){
+    var checkMediaQuery = function(){
+      var type = window.matchMedia("min-width: 1025px").matches ? 'desktop' : 'mobile';
+      if (type !== this.state.type){
+        this.setState({type:type}); 
+      }
+    };
+    
+    window.addEventListener('resize', checkMediaQuery);
+    checkMediaQuery();
+  },
+  render: function(){
+    return this.props.children;
+  }
+});
+```
+
 ## When not to use context
 
 Just as global variables are best avoided when writing clear code, you should avoid using context in most cases. In particular, think twice before using it to "save typing" and using it instead of passing explicit props.