Skip to content

Commit

Permalink
Read/write refs on this (#125)
Browse files Browse the repository at this point in the history
Fixes #123

Using the `ref` prop writes the ref to the `this.refs` object.

However, setting a ref with a callback is not allowed to write to the frozen `this.refs`. The `writeRef` props writes directly to `this` instead.
  • Loading branch information
ethul authored Nov 21, 2017
1 parent b7b7a99 commit f2253e3
Show file tree
Hide file tree
Showing 2 changed files with 6 additions and 6 deletions.
7 changes: 2 additions & 5 deletions src/React.js
Original file line number Diff line number Diff line change
Expand Up @@ -43,8 +43,7 @@ exports.getChildren = getChildren;
function readRefImpl (this_) {
return function(name) {
return function() {
var refs = this_.refs || {};
return refs[name];
return this_[name];
}
}
}
Expand All @@ -54,9 +53,7 @@ function writeRef(this_) {
return function(name) {
return function(node) {
return function() {
var refs = this_.refs || {};
refs[name] = node;
this_.refs = refs;
this_[name] = node;
return {};
}
}
Expand Down
5 changes: 4 additions & 1 deletion src/React/DOM/Props.purs
Original file line number Diff line number Diff line change
Expand Up @@ -301,13 +301,16 @@ radioGroup = unsafeMkProps "radioGroup"
readOnly :: Boolean -> Props
readOnly = unsafeMkProps "readOnly"

-- | You can use `ref` to store a reference on `this.refs`.
-- | To access the stored reference, `getRefs` can then be used.
ref :: String -> Props
ref = unsafeMkProps "ref"

-- | You can use `writeRef` to store a reference on `Refs`.
-- | You can use `writeRef` to store a reference on `this`.
-- | ```purescript
-- | div [ withRef (writeRef this "inputElement") ] [...]
-- | ```
-- | To access the stored reference, `readRef` can then be used.
withRef
:: forall access eff
. (Nullable Ref -> Eff (refs :: ReactRefs (write :: Write | access) | eff) Unit)
Expand Down

0 comments on commit f2253e3

Please sign in to comment.