Data Usage

Data is properties which you can use to manage you component. It always should be an object, properties inside can be any(string, number, boolean, array, obtect).

Data creates component properties like:

//data property

data: {
item: ‘Lorem Ipsum’,
}

//created property
this.item

You can use data both inside component(recomended for not big data), or imported:

//inside component 
com({
    name: 'jt-tabs',
    data:{
        title: 'My Title',
        content: 'My content...',
    },
    tpl() {
        return html`
            <h1>{{title}}</h1>
            <p>{{content}}</p>
        `;
    },
});

//import if big file, or you can not import, but use in same file if it good for you
//data.js
export const data = {
        title: 'My Title',
        content: 'My content...',
        //can be a lot of propirties more..
    }
    
//app.js
import { data } from './data.js';

com({
    name: 'jt-tabs',
    data: data,
    tpl() {
        return html`
            <h1>{{title}}</h1>
            <p>{{content}}</p>
        `;
    },
});

Every component can have it’s own property data, even it has props.

Example