Struggling to implement a tree structure in vue.js and encountering an issue with element props. Any assistance would be greatly appreciated.
I've attempted using :content="{{tempCont}}"
as well as content="{{tempCont}}"
, but neither approach proved successful.
Below is where the tree
element is being utilized:
<div id="tree">
<treeItem :title="Parent" :content="{{tempCont}}"></treeItem>
</div>
Here's the complete tree element code:
<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>
Error message received: