입문

항목 수정
지금까지$navigateTo 화면으로 이동한 곳은 $showModal 으로 변경되었습니다.
그런 다음 표시되는 ActionBar는 표시되지 않습니다.
그때 조사한 거 정리할게요.

결론

갑자기 결론을 얻다<Frame></Frame> 포위 모드의 HTML 부분이 없기 때문입니다.

<template>
    <Page class="page">
        （省略）
    </Page>
</template>

열다

<template>
    <Frame>
        <Page class="page">
            （省略）
        </Page>
    </Frame>
</template>

에서 설명한 대로 해당 매개변수의 값을 수정합니다.

재현해 봤어요.

Playground도 아주 간단한 프로젝트를 준비했다.
10분 정도.

코드

홈 화면 이외에도 모드 A와 모드 B가 있다.
HTML 섹션만 발췌합니다.<Frame></Frame>의 부분만 바뀌었다.
ModalA.vue

<template>
    <Page>
        <ActionBar title="Modal A ActionBar" />
        <FlexboxLayout flexDirection="column">
            <Label text="I am modal A!" />
            <Button @tap="$modal.close" text="Close" />
        </FlexboxLayout>
    </Page>
</template>

ModalB.vue

<template>
    <Frame>
        <Page>
            <ActionBar title="Modal B ActionBar" />
            <FlexboxLayout flexDirection="column">
                <Label text="I am modal B!" />
                <Button @tap="$modal.close" text="Close" />
            </FlexboxLayout>
        </Page>
    </Frame>
</template>

그리고 홈페이지 화면입니다.$showModal에서 각각 모드 A와 모드 B를 표시하는 단추를 준비합니다.
버튼 배치도 용설란주다.
import를 통해서만 HTML에서 얻을 수 없기 때문에 데이터에서 return을 진행했습니다.
풀스크린 그냥 평소 습관대로 넣었어요.
안드로이드만 유효합니다.(iOS는 fullscreen이어야 함)
ModalTest.vue

<template>
    <Page>
        <ActionBar title="ActionBarTest" />
        <GridLayout rows="*, auto, auto, *">
            <Button row="1" text="Modal A"
                @tap="$showModal(modalA,　{ fullscreen: true })"
                class="custom-button" />
            <Button row="2" text="Modal B"
                @tap="$showModal(modalB,　{ fullscreen: true })"
                class="custom-button" />
        </GridLayout>
    </Page>
</template>

<script>
    import modalA from "./ModalA";
    import modalB from "./ModalB";
    export default {
        data() {
            return {
                modalA,
                modalB
            };
        }
    };
</script>

스크린

NativeScript Playground과NativeScript Preview를 사용해 실제로 스마트폰으로 이동해 봤다.
홈페이지 화면이 이런 느낌이에요.
품앗이가 심하군..

순서대로 버튼을 누르다.
위쪽Modal A 단추를 누릅니다.

놀랄 게 없어요.
아래Modal B 단추를 누르십시오.

오, 액션 바 나왔어!

참고 자료

이 Issue를 읽고 바로 해결했습니다.
정말 감사합니다.
https://github.com/nativescript-vue/nativescript-vue/issues/311