News for hackers. Stuff that matters.
Re:Vue.js 3 by iudqnolq on Sunday September 20, 2020 @07:55AM (#24533456)
I think the idea is that the backend already iterates over the data and spits out for example a ul with a li per faq item. You edit the template the backend uses so that the vue annotations are also produced, which in theory is easier than changing the backend code.

EDIT:

Previous HTML outputted by for loop in backend template:

  <ul>
    <li>
      <h2>Question 1</h2>
      <p>Answer 1</p>
    </li>
    <li>
      <h2>Question 2</h2>
      <p>Answer 2</p>
    </li>
  </ul>
New HTML outputted by for loop in backend template

  <ul>
    <li>
      <h2>
        <button v-on:click="expanded = 1">
          Question 1
        </button>
      </h2>
      <p v-if="expanded === 1">Answer 1</p>
    </li>
    <li>
      <h2>
        <button v-on:click="expanded = 2">
          Question 2
        </button>
      </h2>
      <p v-if="expanded === 2">Answer 2</p>
    </li>
  </ul>

There are no comments on this comment yet.