#How can i set element property in yew?

1 messages · Page 1 of 1 (latest)

rustic tree
#

can anybody help me about this? i'm very confuse...
there is my code, i want to set div's background and height
use std::ops::Div;
use gloo::console::log;
use wasm_bindgen::JsCast;
use web_sys::HtmlDivElement;
use yew::prelude::*;

#[derive(PartialEq, Properties)]
pub struct BackgroundProps {
pub height: u8,
pub img_url: AttrValue,
}

#[function_component]
pub fn Background(props: &BackgroundProps) -> Html {
let node_ref = use_node_ref();
{
let node_ref = node_ref.clone();
use_effect_with(node_ref, |node_ref| {
let div:HtmlDivElement = node_ref.cast::<HtmlDivElement>().unwrap();
div.style().set_property("background-image", format!("url('{}')", props.img_url)).unwrap();
div.style().set_property("height",format!("{}vh", props.height)).unwrap();
log!("{}", div.to_string());
})
}

html! {
    <div ref={node_ref}  class="absolute w-full h-full"></div>
}

}

then i got this error:

error[E0599]: no method named style found for struct HtmlDivElement in the current scope
--> src\components\background.rs:20:17
|
20 | ... div.style().set_property("background-image", format!("url('{}')", props.img_url)).unwrap();
| ^^^^^ method not found in HtmlDivElement

error[E0599]: no method named style found for struct HtmlDivElement in the current scope
--> src\components\background.rs:21:17
|
21 | div.style().set_property("height",format!("{}vh", props.height)).unwrap();
| ^^^^^ method not found in HtmlDivElement

long sand
rustic tree