标签: web-sys

如何用 yew 查询和更新 DOM?

有什么办法可以通过 DOM 操作吗use_node_ref?或者,如何document.query_selector()使用红豆杉在 Rust 中进行操作?

use web_sys::HtmlInputElement;
use yew::{
    function_component, functional::*, html,
    NodeRef, Html
};

#[function_component(UseRef)]
pub fn ref_hook() -> Html {
    let input_ref = use_node_ref();
    let all_editables =  input_ref.query_selector("[contenteditable]")
    web_sys::console::(all_editables)

    html! {
        <div>
            <input ref={input_ref} type="number" />
        </div>
    }
}

Run Code Online (Sandbox Code Playgroud)

目标:我有一个富文本编辑器应用程序。我有一个像这样的字符串形式的缩小的 html <h1> this is title</h1><p>hello world</>,我需要获取 DOM 并更改innerHTML以将其设置为此值。

目标2:innerHtml当用户在元素中写入内容时,我还需要更新contenteditable。例如,当用户输入时@john smith,我将创建一个<a>元素,其中包含指向 的个人资料的href链接。John smith

rust reactjs yew web-sys

2
推荐指数
1
解决办法
2357
查看次数

如何在 WebAssembly 中使用 web-sys 发出带有 JSON 正文的 POST 请求?

如何在 WebAssembly 中使用 web-sys 创建带有 JSON 主体的 POST 请求?

下面这个例子展示了如何发出 GET 请求,我需要更改opts.method("GET"); opts.method("POST"); 但我如何将 JSON 主体传递给 reqeuest.

    let mut opts = RequestInit::new();
    opts.method("GET");
    opts.credentials(web_sys::RequestCredentials::Include);
    
    let request = Request::new_with_str_and_init(
        "http://localhost:8080/api/v1/books",
         &opts
    ).unwrap();
    
    match web_sys::window() {
        Some(window) => {
            let _res = JsFuture::from(window.fetch_with_request(&request))
                .await
                .map(|err| web_sys::console::log_1(&format!("{:?}", err)
                .into()));
        },
        None => web_sys::console::log_1(&format!("window is none").into()),
    }
Run Code Online (Sandbox Code Playgroud)

rust webassembly wasm-bindgen yew web-sys

2
推荐指数
1
解决办法
2191
查看次数

标签 统计

rust ×2

web-sys ×2

yew ×2

reactjs ×1

wasm-bindgen ×1

webassembly ×1