mirror of
https://github.com/flarum/core.git
synced 2025-08-04 15:37:51 +02:00
forum: change some LinkButton code to properly work with 'active' attribute
This commit is contained in:
@@ -51,11 +51,10 @@ export default class Component<T extends ComponentProps = any> {
|
|||||||
* containing all of the `li` elements inside the DOM element of this
|
* containing all of the `li` elements inside the DOM element of this
|
||||||
* component.
|
* component.
|
||||||
*
|
*
|
||||||
* @param {String} [selector] a jQuery-compatible selector string
|
* @param selector a jQuery-compatible selector string
|
||||||
* @returns {jQuery} the jQuery object for the DOM node
|
|
||||||
* @final
|
* @final
|
||||||
*/
|
*/
|
||||||
$(selector?: string) {
|
$(selector?: string): ZeptoCollection {
|
||||||
const $element = $(this.element);
|
const $element = $(this.element);
|
||||||
|
|
||||||
return selector ? $element.find(selector) : $element;
|
return selector ? $element.find(selector) : $element;
|
||||||
|
@@ -31,8 +31,8 @@ export interface ButtonProps extends ComponentProps {
|
|||||||
* be used to represent any generic clickable control, like a menu item.
|
* be used to represent any generic clickable control, like a menu item.
|
||||||
*/
|
*/
|
||||||
export default class Button<T extends ButtonProps = ButtonProps> extends Component<T> {
|
export default class Button<T extends ButtonProps = ButtonProps> extends Component<T> {
|
||||||
view(vnode) {
|
view() {
|
||||||
const { children, ...attrs} = vnode.attrs;
|
const { children, ...attrs} = this.props;
|
||||||
|
|
||||||
attrs.className = attrs.className || '';
|
attrs.className = attrs.className || '';
|
||||||
attrs.type = attrs.type || 'button';
|
attrs.type = attrs.type || 'button';
|
||||||
|
@@ -1,7 +1,7 @@
|
|||||||
import Button, {ButtonProps} from './Button';
|
import Button, {ButtonProps} from './Button';
|
||||||
|
|
||||||
interface LinkButtonProps extends ButtonProps {
|
interface LinkButtonProps extends ButtonProps {
|
||||||
active: boolean;
|
active: string;
|
||||||
oncreate: Function;
|
oncreate: Function;
|
||||||
href?: string;
|
href?: string;
|
||||||
}
|
}
|
||||||
@@ -23,26 +23,22 @@ export default class LinkButton extends Button<LinkButtonProps> {
|
|||||||
props.active = this.isActive(props);
|
props.active = this.isActive(props);
|
||||||
}
|
}
|
||||||
|
|
||||||
view(vnode) {
|
view() {
|
||||||
const vdom = super.view(vnode);
|
const vdom = super.view();
|
||||||
|
|
||||||
vdom.tag = m.route.Link;
|
vdom.tag = m.route.Link;
|
||||||
|
|
||||||
return vdom;
|
return vdom;
|
||||||
}
|
}
|
||||||
|
|
||||||
onupdate(vnode) {
|
|
||||||
super.onupdate(vnode);
|
|
||||||
|
|
||||||
this.props.active = LinkButton.isActive(this.props);
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Determine whether a component with the given props is 'active'.
|
* Determine whether a component with the given props is 'active'.
|
||||||
*/
|
*/
|
||||||
static isActive(props: LinkButtonProps): boolean {
|
static isActive(props: LinkButtonProps): string {
|
||||||
return typeof props.active !== 'undefined'
|
return String(
|
||||||
? props.active
|
typeof props.active !== 'undefined'
|
||||||
: m.route.get() === props.href;
|
? props.active
|
||||||
|
: m.route.get() === props.href
|
||||||
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user