Struct Image

pub struct Image { /* private fields */ }

The Image component for displaying images with various options.

Arguments

• props - The properties of the component.

Returns

(Html): An HTML representation of the image component.

Examples

use next_rs::prelude::*;
use next_rs::{Image, ImageProps, log};

#[func]
pub fn MyComponent() -> Html {
    let image_props = ImageProps {
        src: "images/logo.png",
        alt: "Example Image",
        width: "200",
        height: "300",
        style: "border: 1px solid #ddd;",
        class: "image-class",
        sizes: "(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw",
        quality: "80",
        priority: true,
        placeholder: "blur",
        on_loading_complete: Callback::from(|_| {
            log(&format!("Image loading is complete!").into());
        }),
        object_fit: "cover",
        object_position: "center",
        on_error: Callback::from(|err| {
            log(&format!("Error loading image 1: {:#?}", err).into());
        }),
        decoding: "async",
        blur_data_url: "data:image/png;base64,....",
        lazy_boundary: "200px",
        unoptimized: false,
        node_ref: NodeRef::default(),
        ..ImageProps::default()
    };

    rsx! {
        <Image ..image_props />
    }
}

Trait Implementations

impl BaseComponent for Image

where Self: 'static,

type Message = ()

The Component’s Message.

type Properties = ImageProps

The Component’s Properties.

fn create(ctx: &Context<Self>) -> Self

Creates a component.

fn update(&mut self, _ctx: &Context<Self>, _msg: Self::Message) -> bool

Updates component’s internal state.

fn changed( &mut self, _ctx: &Context<Self>, _old_props: &Self::Properties, ) -> bool

React to changes of component properties.

fn view(&self, ctx: &Context<Self>) -> HtmlResult

Returns a component layout to be rendered.

fn rendered(&mut self, _ctx: &Context<Self>, _first_render: bool)

Notified after a layout is rendered.

fn destroy(&mut self, _ctx: &Context<Self>)

Notified before a component is destroyed.

fn prepare_state(&self) -> Option<String>

Prepares the server-side state.

impl Debug for Image

fn fmt(&self, f: &mut Formatter<'_>) -> Result

Formats the value using the given formatter.

impl FunctionProvider for Image

type Properties = ImageProps

Properties for the Function Component.

fn run(ctx: &mut HookContext, props: &Self::Properties) -> HtmlResult

Render the component. This function returns the Html to be rendered for the component.