Vue:将数据传递给动态组件

Posted

技术标签:

【中文标题】Vue:将数据传递给动态组件【英文标题】:Vue: pass data to dynamic component 【发布时间】:2019-01-03 22:00:38 【问题描述】:

根据官方帮助(https://vuejs.org/v2/guide/components-dynamic-async.html),我已经为动态组件做了如下代码。

很容易将 props 传递给函数 resolve()。

但问题是,如何在 'resolve' 函数之前传递 taskId - 需要 VAR 而不是固定值 '1341'?

非常感谢!

Vue.component('task-name', function(resolve, reject)

    // var instead '1341'?

    axios.post("http://my-cite.com/taskname", taskId: '1341').then(function (response)

        resolve(

            props: ['taskId'],

            data: function()
                return 
                    response: response
                
            ,

            template: '<div>I am async! And the response is: response</div>'           
        )
    )

)

【问题讨论】:

你要传递给组件的值是从哪里来的? 【参考方案1】:

您可以使用v-bind

<div is="task-name" v-bind="myProp"></div>

其中myProptaskId: '1341'

【讨论】:

我认为问题在于他正在从 Promise 返回一个组件,并希望在没有组件处理 props 的情况下将 prop 输入到 Promise。我认为它需要一个包装器组件来处理道具。

以上是关于Vue:将数据传递给动态组件的主要内容,如果未能解决你的问题,请参考以下文章

如何使用ts将数据传递给vue3中的多深度子组件

vue js将数据传递给组件

Vue-Router 将数据传递给另一个组件

Primeng - 对话服务将数据传递给对话组件

似乎无法通过 Vue 中的道具将数据传递给组件

如何将数据传递给嵌套的子组件vue js?