Как создать условия и циклы с помощью Vue.js в html разметке?

Где то видел что такое возможно, видел как делали что то типа for прямо в разметке html, и блок многократно выводился, как такое можно сделать?

Да очень просто, лучше покажу и объясню на примере:

var menu_items = new Vue({
el: '#menu_items',
data: {
menu: [
{
elem: 'Салат' },
{ elem: 'Суп' },
{ elem: 'Суп пюре' }
]
}
})

В первом куске кода создаем переменную инициализируя её объектом типа Vue, затем задаем id который нужно привязать к html разметке страницы, после задаем данные которые будем внедрять на страницу, так как мы будем это делать через цикл for, делаем массив который называется menu, там три элемента. В html части создаем общий блок с таким же id как и у объекта Vue и создаем упорядоченный список и внутри него в теге элемента (list item - li) прописываем v-for и справа указываем элементы какого массива следует перечислить а слева то что является элементом меню и на чем мы будем осуществлять вызова элемента массива.

<div id="menu_items">

Меню:
<li
v-for="item in menu">
{{ item.elem }}