在传递本机脚本this时遇到麻烦。$ navigateTo()
<template>
<stack-layout v-for="meme in memes">
<Image :src="meme.url" @tap="goToEditPage(meme.url)"/>
</stack-layout>
</template>
<script>
import EditMeme from './EditMeme'
export default {
computed: {
memes(){
return this.$store.getters.memes
}
},
components: {
EditMeme
},
methods: {
goToEditPage(ImageUrl) {
this.$navigateTo(EditMeme, { context: { propsData: { Image: ImageUrl } }});
}
}
}
</script>
我尝试传递道具this way
仍然,在子组件中,我得到了一个未定义的, 这是子组件:
export default {
props: ['Image'],
methods: {
onButtonTap() {
console.log(this.props);
}
}}
有什么想法吗?我是vue.js的新手,所以很有可能我的代码中缺少一些基本的东西
答案 0 :(得分:4)
正确的导航方式是:
this.$navigateTo(confirmRoute, {
props: {
hospital: "hospital A",
startpoint: "startpoint Y",
endpoint: "point x"
}
})
您只需要这样捕获它,或者您下一页:
props: ['hospital', 'startpoint', 'endpoint'],
,然后可以在JS中像这样使用它:
this.hospital
this.startpoint
this.endpoint
如果您希望在模板中使用它,则需要执行以下操作:
<template>
<Page>
<Label :text="$props.hospital.name">
</Label>
</FlexBoxLayout>
</Page>
</template>
答案 1 :(得分:0)
如果使用nativescript vue:
@tap="$navigator.navigate('/settings/your_page', {props: { isEditMode: true }})"
在your_page.vue中:
props: { isEditMode: { type: Boolean, default: false, required: false } },
mounted() { console.log("isEditMode :>> ", this.isEditMode); }