Vue中的单个“列表”组件与重复的单个组件

时间:2019-10-16 01:46:07

标签: javascript vue.js vuejs2 vue-component vue-router

我只是在学习Vue,然后按照一门课程反复演示如何获取一些示例数据的示例,然后创建一个使用v-for指令对数据进行迭代并为每个数据项创建标记的单个组件。

这让我有些奇怪,因为我的直觉是创建一个代表单个数据项的组件,然后为每个数据项创建一个实例。每个实例将能够对自己的数据突变做出反应,发出自己的事件,等等。话虽如此,在单个“ ItemList”组件中进行此操作并动态传递值似乎并不困难,但事实并非如此。由于某种原因,我不能和我一起坐。

我的问题是:是否甚至可以创建一个父组件,该父组件可以迭代某些数据并实例化表示单个数据项的另一个组件的多个实例?

到目前为止,我的经验是,任何给定的组件都可以导入,并且您可以访问该组件,因此,我什至不确定一个给定组件可以有多个实例。给出了我上一个问题的答案之后,这是一种最佳实践,还是仅使用单个组件循环访问所有数据?

1 个答案:

答案 0 :(得分:1)

您可以使用Vue提供给您的import tts.sapi voice = tts.sapi.Sapi() voice.say("Hello") voice.set_voice("Anna") voice.create_recording('output.wav', "This will be in a wav file") voice.set_rate(-5) voice.say("This will be said slower") 帮助程序来完成此操作。

<component></component>

您应该将其写在父组件的模板中,其中父组件包括<component v-for="(row, index) in rows" :key="`rows-${index}`" :is="RowRenderer" :row="row"></component> 组件:

RowRenderer