Looking for Sycamore v0.9? Check out our new website!

This is outdated documentation for Sycamore.

For up-to-date documentation, see the latest version (v0.8).

NodeRef

Sometimes we want to be able to reference a node in the DOM directly. We can do so by using NodeRef.

A NodeRef can be created by using NodeRef::new(). This can be assigned, in turn, to a node using the ref property in the template! macro.

let node_ref = NodeRef::new();

template! {
    p(ref=node_ref) { "Hello World!" }
}

node_ref is now a reference to the p node.

We can access the raw node using the .get() method on NodeRef.

node_ref.get::<DomNode>()

Note that this method will panic! if the NodeRef has not been assigned to a node or if the NodeRef has the wrong type. That means that calling node_ref.get::<DomNode>() will panic! in a server side rendering context (which uses SsrNode instead of DomNode).