fix: 🐛 修复主设置面板下 stagebox 的样式问题

This commit is contained in:
muyun.my 2020-08-03 17:59:16 +08:00
parent 5298f85bdf
commit d5a98c090d
4 changed files with 18 additions and 11 deletions

View File

@ -1,9 +1,13 @@
@import "~@ali/ve-less-variables/index.less";
.skeleton-stagebox {
overflow: hidden;
position: relative;
min-height: 50px;
overflow-x: hidden;
overflow-y: auto;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
.skeleton-stagebox-stage {
height: auto;
overflow: hidden;

View File

@ -72,6 +72,8 @@ export default class StageBox extends Component<StageBoxProps> {
if (target === 'stageback') {
this.stageChain.stageBack();
} else if (target === 'stageexit') {
this.stageChain.stageBackToRoot();
} else {
const { skeleton } = this.props;
this.stageChain.stagePush(skeleton.getStage(target));

View File

@ -30,12 +30,13 @@ export default class StageChain {
*
*/
stageBackToRoot() {
while (!this.stage.isRoot) {
const stage = this.stage.getPrevious();
if (!stage) return;
stage.setReferRight(this.stage);
this.stage = stage;
let rootStage = this.stage.getPrevious();
while (rootStage && !rootStage.isRoot) {
rootStage = rootStage.getPrevious();
}
if (!rootStage) return;
rootStage.setReferRight(this.stage);
this.stage = rootStage;
this.emitter.emit('stagechange');
}

View File

@ -71,10 +71,10 @@ export default class Stage extends Component<StageProps> {
);
const stageBacker = stage?.hasBack() ? (
<div className="skeleton-stagebox-stagebacker" data-stage-target="stageback">
<Icons name="arrow" className="skeleton-stagebox-stage-arrow" size="medium" />
<div className="skeleton-stagebox-stagebacker">
<Icons name="arrow" className="skeleton-stagebox-stage-arrow" size="medium" data-stage-target="stageback" />
<span className="skeleton-stagebox-stage-title">{stage.title}</span>
<Icons name="exit" className="skeleton-stagebox-stage-exit" size="medium" />
<Icons name="exit" className="skeleton-stagebox-stage-exit" size="medium" data-stage-target="stageexit" />
</div>
) : null;