本机脚本传递道具

hhh*_*hhh 4 javascript vue.js nativescript

无法在本机脚本中传递道具。$ 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>
Run Code Online (Sandbox Code Playgroud)

我尝试通过这种方式传递道具

仍然,在子组件中,我得到了一个undefined,这是子组件:

  export default {
props: ['Image'],
methods: {
  onButtonTap() {

    console.log(this.props);
  }
  }}
Run Code Online (Sandbox Code Playgroud)

有任何想法吗?我是vue.js的新手,所以很可能我的代码中缺少一些基本的东西

Ste*_*ven 6

正确的导航方式是:

this.$navigateTo(confirmRoute, {
                    props: {
                        hospital: "hospital A",
                        startpoint: "startpoint Y",
                        endpoint: "point x"
                    }
                })
Run Code Online (Sandbox Code Playgroud)

您只需要这样捕获它,或者您下一页即可:

 props: ['hospital', 'startpoint', 'endpoint'],
Run Code Online (Sandbox Code Playgroud)

然后可以在JS中像这样使用它:

this.hospital
this.startpoint
this.endpoint
Run Code Online (Sandbox Code Playgroud)

如果您希望在模板中使用它,则需要执行以下操作:

<template>
    <Page>
            <Label  :text="$props.hospital.name">
            </Label>
        </FlexBoxLayout>
    </Page>
</template>
Run Code Online (Sandbox Code Playgroud)