How to deal with classes

[roine]

I'm using babel to compile my JSX and ES6 and I'm creating component with ES6 classes rather than React.createClass. Unfortunately classes don't support mixins, is there a way around to use your lib?

[banyan]

@roine

let ReactAutolink = require('react-autolink');
ReactAutolink.autolink(text);

would work. I'll add these to README as well. Thanks!

[diffractometer]

This worked for me, but I am now getting the error

Warning: Each child in an array or iterator should have a unique "key" prop

My code:

ReactAutolink.autolink(this.props.tweet.text, { target: "_blank", rel: "nofollow" })

When I remove the autolink the error msg goes away. It's inside of a component which has a correctly assigned key, the error only shows when I add the autolink.

Any thoughts?

[jxodwyer]

@diffractometer This is occurring because autolink is returning an array. In order to avoid the key warning, you could add a key to the option obj you are passing in. For ex:

ReactAutolink.autolink(this.props.tweet.text, { target: "_blank", rel: "nofollow", key: this.props.tweet.id })

[jakubwolny]

@jxodwyer but then if you have 2 (or more) links inside your "text" variable you will receive React "flattenChildren" warning and only the 1st link will be displayed!

[masone]

Setting the key on the autolink component does not help. I still get this error if the text contains multiple links because the same key is assigned to all a components that are returned

[masone]

@fujimura seems to have tackled this in fujimura@aba7d7c
so has @jxodwyer in https://github.com/jxodwyer/react-autolink/commit/7ae558b15954b4dba2e7b154c8ae664994e86026

maybe one of you could open a pull request?

[fujimura]

👍 I'll make it.

[diffractometer]

@jxodwyer thank you btw, that worked. Sorry I didn't reply back in March.