Javascript Vuejs如何将数据作为道具传递给子组件

我构建了以下组件：

var Modal = Vue.component('modal', {

    template: `
        <div id="modal" class="modal">
            <div class="modal-content">
                <p>{{ link }}</p>
            </div>
        </div>
    `,

    props: [
        'link'
    ],

});

我的Html标记：

        <modal link=""></modal>
       ...
        <button type="button"                      
                   v-bind:class="{ 'modal-trigger': !isActiveModal }"
                   @click="publish">Publish
                   <i class="material-icons right">send</i>
        </button>

...
发表
发送

---

因此，我成功地将axios post发送到我的服务器并获取数据，我想打开一个模式窗口并将数据放入一个p标记中，到目前为止，模式会在我的帖子后弹出，但我不确定它是否会更改p标记的内容。

根据我的理解，Snippetlink属性可用于保存来自服务器的数据

self.Snippetlink = response.data.hash;

并将Snippetlink传递给snippet模型的link属性

 <snippet-modal :link="Snippetlink"></snippet-modal>

鲁佩什·帕迪的答案是正确的。这只是进一步的解释

首先，要将响应数据存储到Vue组件，首先需要在
data
中为此定义一个键。因此，要使这一行正常工作：
self.link=response.data.hash
，您需要添加
链接
，作为Vue组件数据的键：

data: {
        userId: '',
        title: '',
        body: '',
        snippetLink: '',
        link: ''
    },

如果您的意思是
snippetLink
，请将行更改为
self.snippetLink=response.data.hash

其次，要将数据作为道具传递给子组件，必须指定道具名称以及传递的数据键。例如，要将组件的
链接作为具有相同名称的道具传递给
snippet modal
组件，您需要：
hmm它应该返回“SnippetLink”，而不是response@rupesh_padhye我会接受的，但是你能补充一下关于发生了什么的信息吗。。。
data: {
        userId: '',
        title: '',
        body: '',
        snippetLink: '',
        link: ''
    },