Preact: dangerouslySetInnerHTML?

[jwalton]

In React, you can set inner HTML with something like:

<div dangerouslySetInnerHTML={{__html: 'my markup'}} />

but preact doesn't seem to support this? Any tips on how to achieve something similar?

[developit]

This is intentionally not in preact, though it could be added to preact-compat.
You can set innerHTML in a life cycle method like componentDidUpdate or componentDidMount.

Example:

class Foo extends Component {
  componentDidMount() {
    this.base.innerHTML = 'hello';
  }
}

[jwalton]

That works client side, but obviously would not work for server side rendering (since componentDidMount() will never run on the server.)

(Apologies if this comment shows up twice - I replied by email but github seems to have lost the email version. :P)

[developit]

True, very good point. Perhaps that's the selling point of __dangerouslySetInnerHTML then!

[developit]

@jwalton - just published a prerelease of 3.0 which supports dangerouslySetInnerHTML. On npm as preact-3.0.0-beta1

[jwalton]

You, sir, are a scholar and a gentleman. :)

[developit]

Now generally available as of 3.2.