Module maomi::prop

source ·
Expand description

The properties utilities.

The properties of components can be set through templates by component users.

Basic Usage

The following example show the basic usage of properties.

use maomi::prelude::*;
 
#[component]
struct MyComponent {
    template: template! {
        /* ... */
    },
    // define a property with the detailed type
    my_prop: Prop<usize>,
}
 
impl Component for MyComponent {
    fn new() -> Self {
        Self {
            template: Default::default(),
            // init the property with a default value
            my_prop: Prop::new(123),
        }
    }
}
 
#[component]
struct MyComponentUser {
    template: template! {
        // set the property value
        <MyComponent my_prop=&{ 456 } />
    },
}

Two-way Property

Most property values are passing from the component user to the component. The component should not modify its own properties, otherwise the next updates of the component user will change them back. However, some properties (like value property in <input> ) should be passing back from the component to the component user. BindingProp is designed to solve this problem.

A BindingProp accepts a BindingValue . A BindingValue contains a value shared between the component and the component user. It can be visited on both ends.

use maomi::prelude::*;
use maomi::prop::{BindingProp, BindingValue};
 
#[component]
struct MyComponent {
    template: template! {
        /* ... */
    },
    // define a two-way property with the detailed type
    my_prop: BindingProp<String>,
}
 
impl Component for MyComponent {
    fn new() -> Self {
        Self {
            template: Default::default(),
            // init the two-way property
            my_prop: BindingProp::new(String::new()),
        }
    }
}
 
#[component]
struct MyComponentUser {
    template: template! {
        // associate a binding value
        <MyComponent my_prop={ &self.comp_value } />
    },
    comp_value: BindingValue<String>,
}
 
impl Component for MyComponentUser {
    fn new() -> Self {
        Self {
            template: Default::default(),
            // init the binding value
            comp_value: BindingValue::new(String::new()),
        }
    }
}

List Property

ListProp is one special kind of properties. It can accepts one attribute more than once. This helps some special cases like class:xxx syntax in maomi_dom crate.

use maomi::prelude::*;
use maomi::prop::ListProp;
 
#[component]
struct MyComponent {
    template: template! {
        /* ... */
    },
    // define a list property with the detailed item type
    my_prop: ListProp<String>,
}
 
impl Component for MyComponent {
    fn new() -> Self {
        Self {
            template: Default::default(),
            // init the list property
            my_prop: ListProp::new(),
        }
    }
}
 
#[component]
struct MyComponentUser {
    template: template! {
        // set the list property value
        <MyComponent my_prop:String="abc" my_prop:String="def" />
        // this is the same as following
        <MyComponent my_prop={ &["abc".to_string(), "def".to_string()] } />
    },
}

Structs

  • A two-way property that can share a BindingValue between a component and its user.
  • A value that can be associated to a BindingProp .
  • A list property that can be used in templates.
  • A property of components that can be set through templates.

Traits