Как добавить клас к елементу vue.js при наведении?

Question

[Vanya Huk]

Как добавить клас к елементу vue.js при наведении ?

Answer 1

[Антон Антон]

<div @mouseenter="hoverClass='myclass'" @mouseleave="hoverClass=''"  :class="hoverClass"></div>

ну и добавить hoverClass:'' в data
вообще, реактивность - вещь! https://jsfiddle.net/4nokawsf/3/

Comments

[Vanya Huk]

Антон Антон : он добавляет всем таким же елементам етот класс, а мне нужно только текущему

[Антон Антон]

Vanya Huk: ну я ж не телепат. Например, если выводится массив через v-for, то в событиях, что характерно, можно менять свойства текущего элемента.

[Vanya Huk]

Антон Антон: как просто добавить елементу, на который наведен курсор класс?

[Антон Антон]

Vanya Huk: что-то типа того https://jsfiddle.net/4nokawsf/2/

[Vanya Huk]

Антон Антон: вот в том то и проблема, что
list:[
{name: 'Вася', hover:false},
{name: 'Петя', hover:false},
{name: 'Галя', hover:false},
{name: 'Нина', hover:false}
]
у меня нету, есть только

var app = new Vue({

    el      : "#app",

    data    : {

        loader          : false,

        activeProduct   : 'active'

        },

    methods :{


    }

})

и html

[Антон Антон]

Vanya Huk: нифига не понятно, выложи то, что есть сейчас, на jsfiddle

[Vanya Huk]

ок

[Vanya Huk]

Антон Антон: https://jsfiddle.net/owd9L5zk/ вот, там laravel работает

[Антон Антон]

Vanya Huk: ну так vue здесь ни за что не отвечает. Тут либо делать это без помощи vue, либо отдавать статику с компонентом vue, потом в created() запрашивать данные для data через ajax в виде json и уже из рендерить в шаблон. Т.е. отказаться от server side rendering полностью или частично.

[Vanya Huk]

Антон Антон: я бы давал json прямо во vue , но незнаю как ето повлияет на сео и на загрузку сайта

[Vanya Huk]

Антон Антон: хорошо, когда страница сразу рендериться

Answer 2

[tripcollor]

А не проще сделать на обычном js ?
https://jsfiddle.net/tripcollor/cxt48Lo9/

Comments

[Vanya Huk]

хотелось бы интегрировать проект с vue js просто