将数据传递给组件

Question

我有动态组件：

<component v-bind:is="current.ComponentName" :myvar="current.Text"></component>

我正在尝试为当前解析的组件传递变量 myvar。

子组件定义如下：

    <template>
        <div id="home">
            <h1>2 {{ myvar }} aasa</h1>
        </div>
    </template>

    <script>
        Vue.component(
            'MyComponentName',
            {
                props: ['myvar']
            });
    </script>

动态组件解析有效，但我无法通过:myvar=... 传递任何数据。我该怎么做？

Answer 1

如果我误解了您的问题，我很抱歉，不清楚，如果我这样做了，请在 cmets 中告诉我，我将编辑我的答案。你的问题也不是很完整

---

我想你误解了单个文件组件和 Vue.component 之间的区别

你必须选择一个或另一个，你不能同时混合。

你越像这样定义你的组件：

<template>
  <div id="home">
        <h1>2 {{ myvar }} aasa</h1>
    </div>
 </template>

<script>
export default {
  props: ["myvar"] 
}
</script>

或者像这样：

Vue.component("component-name", {
  props: ["myvar"], 
  template:`
    <div id="home">
        <h1>2 {{ myvar }} aasa</h1>
    </div>
  `
})

文档链接：https://vuejs.org/v2/guide/components.html