javascript - 'v-bind' 指令需要一个属性值

Question

我正在尝试使用 vue.js 创建某种类型的树，但遇到了元素 Prop 的问题。请帮帮我。

我试过 :content="{{tempCont}}" 我试过 content="{{tempCont}}"，但都没有成功了。

这是我使用 tree 元素的地方:

<div id="tree">
    <treeItem :title="Parent" :content="{{tempCont}}"></treeItem>
</div>

这是整个树元素:

<template>
    <div>
        <p v-on:click="openTree">{{title}}</p>
        <div id="childs" v-if="childVisibility">
            <treeItem v-for="item in content" :key="item" title=item>
        </div>
    </div>
</template>

<script>
export default {
    data: {
        childVisibility: false
    },

    methods: {
        openTree: function(){
            childVisibility = !childVisibility;
        }
    },

    props: {
        title: String,
        content: Array,
    }
}
</script>

<style scoped>

</style>

我收到此错误:

Answer 1

像这样使用::content="tempCont"

<div id="tree">
  <treeItem :title="Parent" :content="tempCont"></treeItem>
</div>