我在Nativescript + vue中有一个简单的应用程序,可从一页导航到另一页。 这是我的login.vue
<template>
<FlexboxLayout class="login-page">
<StackLayout class="login-form">
<!-- <Image class="brand-icon" src="~/images/NativeScript-Vue.png" /> -->
<Label class="login-title" text="Xnapp NativeScript" />
<StackLayout class="form-group" marginBottom="15">
<TextField class="input" hint="Email" keyboardType="email" autocorrect="false" autocapitalizationType="none" v-model="user.email"
returnKeyType="next" fontSize="18" />
<StackLayout class="hr-light" />
</StackLayout>
<StackLayout class="form-group" marginBottom="15">
<TextField ref="password" class="input" hint="Password" secure="true" v-model="user.password" :returnKeyType="isLoggingIn ? 'done' : 'next'" fontSize="18" />
<StackLayout class="hr-light" />
</StackLayout>
<StackLayout v-show="!isLoggingIn" class="form-group">
<TextField ref="confirmPassword" class="input" hint="Confirm password" secure="true" v-model="user.confirmPassword" returnKeyType="done"
fontSize="18" />
<StackLayout class="hr-light" />
</StackLayout>
<Button :text="isLoggingIn ? 'Login' : 'Signup'" @tap="submitLogin" class="btn btn-primary m-t-20" />
<Label v-show="isLoggingIn" text="Forgot your password?" class="login-label"/>
</StackLayout>
<Label class="login-label sign-up-label" @tap="toggleForm">
<FormattedString>
<Span :text="isLoggingIn ? 'Don’t have an account? ' : 'Back to Login'" />
<Span :text="isLoggingIn ? 'Sign up' : ''" class="bold" />
</FormattedString>
</Label>
</FlexboxLayout>
</template>
<script lang="ts">
import { Vue, Component, Prop, Watch } from "vue-property-decorator";
import { getFile, getImage, getJSON, getString, request, HttpResponse } from "tns-core-modules/http";
import DashboardComponent from "@/components/dashboard.vue";
import chart from "./chart.vue";
@Component
export default class LoginComponent extends Vue {
isLoggingIn = true;
$navigateTo;
user = {
email: "test@gmail.comr",
password: "123",
confirmPassword: ""
};
toggleForm() {
this.isLoggingIn = !this.isLoggingIn;
}
submitLogin() {
if(this.isLoggingIn)
this.login();
else
this.registration();
}
login() {
alert('login');
this.$navigateTo(DashboardComponent);
// this.$navigateTo(chart);
}
registration() {
alert('registration');
}
// mounted() {
// getJSON("https://jsonplaceholder.typicode.com/posts/").then(result => {
// this.listData = result;
// console.log(this.listData);
// }, error => {
// console.log(error);
// });
// }
}
</script>
<style scoped>
.login-page {
align-items: center;
flex-direction: column;
}
.login-form {
margin-left: 20;
margin-right: 20;
flex-grow: 1;
vertical-align: middle;
}
.brand-icon {
margin-bottom: 12;
height: 90;
font-weight: bold;
}
.login-title {
horizontal-align: center;
font-size: 20;
font-weight: 600;
margin-bottom: 30;
text-align: center;
}
.form-group .form-control {
font-size: 36;
placeholder-color: #A8A8A8;
}
.login-label {
horizontal-align: center;
color: #A8A8A8;
font-size: 16;
}
.sign-up-label {
margin-bottom: 20;
}
</style>
和dashboard.vue
<template>
<Page>
<ActionBar class="page-title" title="Dashboard d"/>
</Page>
</template>
当我单击登录按钮时,点击警报被触发,但未导航到下一页并在日志中显示警告 getFrameById()已过时。改用Frame.getFrameById()。页面。
对此我有什么建议 谢谢 它显示警告