vue.js - vue js，如何在模板中传递数组？

Question

我只想将一个数组或字典传递给 vue 模板:

 Vue.component('step', {

  props: ['data'],
  template: `
      <span> {{data}} {{typeof(data)}}</span>
  `
})

在 html 中:

 <div id="app">
     <step data="['tefdfxt', 'Cats']"></step>
 </div>

被评估为一个字符串，而它应该是一个数组:

  ['tefdfxt', 'Cats'] string

我的问题是:如何以不作为字符串序列求值的方式在 html 属性中传递数组？文档对我没有帮助。当然，我尝试了 {{}}，以及所有的解析器调用。没用。始终评估为字符串。

编辑:

我需要将 v-bind 添加到属性以便被评估为对象: https://forum.vuejs.org/t/how-to-pass-array-in-child-component-as-a-prop/3584

因此将 data="['tefdfxt', 'Cats']" 替换为 v-bind:data="['tefdfxt', 'Cats']"

Answer 1

根据您为 future 读者所做的编辑，您应该将 data 替换为 v-bind:data:

<div id="app">
  <step v-bind:data="['tefdfxt', 'Cats']"></step>
</div>