I have a problem where if I pass a tag object to a component, it always becomes undefined in that component. For example:
import Component, { type ComponentAttrs } from 'flarum/common/Component';
import Tag from "ext:flarum/tags/common/models/Tag";
export interface IGroupManagementActionsAttrs extends ComponentAttrs {
tagId: Number;
}
export default class GroupManagementActions<CustomAttrs extends IGroupManagementActionsAttrs = IGroupManagementActionsAttrs> extends Component<CustomAttrs> {
tag!: Tag;
loading: boolean = true;
async oninit(vnode: Mithril.Vnode<CustomAttrs, this>) {
super.oninit(vnode);
const tag = await app.store.find('tags', this.attrs.tagId, { include: ['memberGroup.users', 'managerGroup.users'] });
this.tag = tag;
this.loading = false;
m.redraw();
}
view() {
return (
<div className="group-management-actions">
<div className="tab-content">
{this.loading ? (
<LoadingIndicator />
) : (
<ChildComponent tag={this.tag} />
)}
</div>
</div>
);
}
}
import Component, { ComponentAttrs } from "flarum/common/Component";
import Mithril from 'mithril';
import Tag from "ext:flarum/tags/common/models/Tag";
export interface IChildComponentAttrs extends ComponentAttrs {
tag: Tag;
}
export default class ChildComponent<CustomAttrs extends IChildComponentAttrs = IChildComponentAttrs > extends Component<CustomAttrs> {
async oninit(vnode: Mithril.Vnode) {
super.oninit(vnode);
}
view() {
console.log(this.attrs.tag)
}
}
In this case logging the tag in the child component logs undefined. When I only send a single attribute of tag like name, it does work. Sending other objects like users also works its just the tag object which I can't get to work.