使用 primereact 按钮将 url 转到新标签页

Question

当用户单击 Home 按钮时，是否可以将用户带到浏览器的新选项卡，而不是在单击按钮的同一选项卡中打开 URL？我想知道如何修改这一行 <Button label="Show" icon="pi pi-bars" onClick={(event) => this.menu.toggle(event)}/> 来实现我的目标。

import React, {Component} from 'react';
import {Menu} from 'primereact/menu';

export class MenuDemo extends Component {

    constructor() {
        super();
        this.state = {
            items: [
                {
                    label: 'Options',
                    items: [{label: 'Upload', icon: 'pi pi-fw pi-upload', command:()=>{ window.location.hash="/fileupload"; }},
                            {label: 'Home', icon: 'pi pi-fw pi-home', url: 'http://primetek.com.tr'}]
                }, 
                {
                    label: 'Account',
                    items: [{label: 'Components', icon: 'pi pi-fw pi-cog', command:()=>{ window.location.hash="/"; }},
                            {label: 'Sign Out', icon: 'pi pi-fw pi-power-off'} ]
                }
            ]
        };
    }

    render() {
        return (
            <div>
                <div className="content-section">
                    <div className="feature-intro">
                        <h1>Menu</h1>
                        <p>Menu is a navigation/command component that supports dynamic and static positioning.</p>
                    </div>
                </div>

                <div className="content-section implementation button-demo">
                    <h3 className="first">Basic</h3>
                    <Menu model={this.state.items}/>

                    <h3>Popup</h3>
                    <Menu model={this.state.items} popup={true} ref={el => this.menu = el}/>
                    <Button label="Show" icon="pi pi-bars" onClick={(event) => this.menu.toggle(event)}/>
                </div>

                <MenuDoc/>

            </div>
        )
    }
}

Answer 1

您可以在 onclick 处理程序中执行类似的操作。

window.open(pageurl, "_blank")

使用 primereact 按钮将 url 转到新标签页

Take url to new tab with primereact button

reactjs

primereact