Nativescript Vue导航困难

时间:2018-10-28 20:26:44

标签: nativescript nativescript-vue

我刚开始使用NativeScript,但我不了解如何浏览页面/视图。不幸的是,似乎仍不支持vue-router,因此我正在考虑使用手动路由。但是,我在app \ components中有多个vue组件,不想将它们全部以example的显示方式放在一个vue中。

在我的第一个页面视图中有这个:

<script>
import pageB from "./PageB";

export default {
    methods: {
        onButtonTap() {
            //console.log("Page B Button was pressed");
            this.$navigateTo(pageB);
        }
    },
    created() {},

    data() {
        return {};
    },
    mounted() {}
};
</script>

但是当我单击按钮时,会收到一条消息:

[iPhone 8+]: The Preview app has terminated unexpectedly. Please run it again to get a detailed crash report. [iPhone 8+]: '{NSVue (Vue:
2.5.17 | NSVue: 2.0.0)} -> CreateElement(nativelabel)' 2018-10-28 13:54:15.823 nsplaydev[1294:331774] -[TNSLabel useLayoutToLayoutNavigationTransitions]: unrecognized selector sent to instance 0x10a909f00 2018-10-28 13:54:15.826 nsplaydev[1294:331774] PlayLiveSync: Uncaught Exception 2018-10-28 13:54:15.827 nsplaydev[1294:331774] PlayLiveSync: Sending crash report 2018-10-28 13:54:19.831 nsplaydev[1294:331774] *** JavaScript call stack: ( 0 pushViewControllerAnimated@[native code] 1 pushViewControllerAnimated@file:///app/tns_modules/tns-core-modules/ui/frame/frame.js:343:61 2
_navigateCore@file:///app/tns_modules/tns-core-modules/ui/frame/frame.js:116:56 3 performNavigation@file:///app/tns_modules/tns-core-modules/ui/frame/frame-common.js:235:27 4
_processNextNavigationEntry@file:///app/tns_modules/tns-core-modules/ui/frame/frame-common.js:227:39 5 navigate@file:///app/tns_modules/tns-core-modules/ui/frame/frame-common.js:131:41 6 navigate@file:///app/tns_modules/nativescript-vue/dist/index.js:6494:24 7 navigate@[native code] 8 @file:///app/tns_modules/nativescript-vue/dist/index.js:13221:26 9 initializePromise@:1:11 10 Promise@[native code] 11 $navigateTo@file:///app/tns_modules/nativescript-vue/dist/index.js:13198:25 12 onButtonTap@file:///app/components/PageB.js:20:29 13 onButtonTap@[native code]
    2018-10-28 13:54:19.831 nsplaydev[1294:331774] *** Terminating app due to uncaught exception 'NSInvalidArgumentException', reason: '-[TNSLabel useLayoutToLayoutNavigationTransitions]: unrecognized selector sent to instance 0x10a909f00'

*** First throw call stack:
(0x226727ef8 ....)
libc++abi.dylib: terminating with uncaught exception of type NSException
2018-10-28 13:54:19.832 nsplaydev[1294:331774] PlayLiveSync: Uncaught Exception

我注意到该错误将所需页面引用为javascript:PageB.js甚至认为该页面不存在。这是否意味着路由无法在此处与vue组件一起使用?

如果任何人都可以为我提供NativeScript的multi vue.file示例的示例,也许这可以帮助我弄清楚这一点。

4 个答案:

答案 0 :(得分:1)

导航似乎按预期工作,请检查此playground sample

答案 1 :(得分:0)

您的代码对我来说看起来不错。您可以发布NativeScript Playground链接,以便我们看看吗?

答案 2 :(得分:0)

使用过的const pageB = require("./PageB").default;

代替import pageB from "./PageB";

答案 3 :(得分:0)

当我第一次被引入NS导航时,我不明白的是,所有导航都在一个元素内进行。不确定这是您的问题,但也许可以快速检查一下。一个简单的一帧示例可能是:

@Controller
public class testController {

@ResponseBody
@RequestMapping(value = "/testPage", method = RequestMethod.POST)
public String downloadFile(Model model, HttpServletRequest request, HttpServletResponse response, @ModelAttribute("file") File file) {
data = file.generateData; //This method returns a string
model.addAttribute("output", fileOutput);
return "testPage";

,然后如您的示例所示,在PageA内导航到PageB。