我有一个material-ui菜单，其中包含以下内容:
<span>
<Link to="/issues">
<Button style={isActive(history, "/issues")}>Issues
</Button>
</Link>
<Link to="/users">
<Button style={isActive(history, "/users")}>Users
</Button>
</Link>
<Link to="/signup">
<Button style={isActive(history, "/signup")}>Create User
</Button>
</Link>
<Link to={"/user/" + auth.isAuthenticated().user._id}>
<Button style={isActive(history, "/user/" + auth.isAuthenticated().user._id)}>My Profile</Button>
</Link>
<Button color="inherit" onClick={() => {
auth.signout(() => history.push('/'))
}}>Sign out</Button>
</span>
它从屏幕左侧开始在一行中显示菜单项。我希望我的个人资料和退出按钮出现在屏幕右侧。我该怎么做？
最佳答案
即使这与react或material-ui无关，您也可以使用flex box:
<div style={{ display: 'flex', justifyContent: 'space-between' }}>
<div>
<Link to="/issues">
<Button style={isActive(history, "/issues")}>Issues
</Button>
</Link>
<Link to="/users">
<Button style={isActive(history, "/users")}>Users
</Button>
</Link>
<Link to="/signup">
<Button style={isActive(history, "/signup")}>Create User
</Button>
</Link>
</div>
<div>
<Link to={"/user/" + auth.isAuthenticated().user._id}>
<Button style={isActive(history, "/user/" + auth.isAuthenticated().user._id)}>My Profile</Button>
</Link>
<Button color="inherit" onClick={() => {
auth.signout(() => history.push('/'))
}}>Sign out</Button>
</div>
</div>
关于javascript - 将菜单选项与 Material-ui 右对齐，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/54127255/