[Vuejs]-Render list from (unkown deep) multidimensional object in Vue

by

0👍

What I would do is the same as the JavaScript snippet you made. You just need to swap the document.getElementById part with a proper Vue ref.

For instance:

<template>
   <div>
      <ul ref="myList"></ul>
   </div>
</template>
<script>
export default {
  name: "Example",
  mounted() {
     const myList = this.$refs.myList;
     myList.innerHTML = "<li>One element</li>";
  }
};
</script>

Not ideal because you lose the Vue part there but quick and easy.
If you want to get more in detail in building this recursive list you can check this out: https://alligator.io/vuejs/recursive-components/

Leave a comment