Воспользуйтесь свойством экземпляра $el
, чтобы получить корневой элемент DOM, управляемый этим экземпляром Vue.
После того как элемент получен, получаем его атрибуты: если только data-* атрибуты необходимо получить, то можно использовать доступ к data атрибутам в JS через Element.getAttribute():
var attribute = element.getAttribute(attributeName);
где attribute
- переменная, которой будет присвоено значение attributeName
.
attributeName
- имя атрибута, значение которого необходимо получить.
или использовать свойство dataset
, чтобы получить объект data
свойств:
new Vue({
el: '#app-cart',
data: () => {
return {
dataAttr: []
}
},
mounted() {
this.dataAttr = { ...this.$el.dataset
}
}
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.min.js"></script>
<div id="app-cart" data-url="http://localhost:3000/products" data-sessid="sessid" data-link-catalog="catalog.html" data-link-index-page="index.html" data-submit-message="Ваша заявка успешно отправлена!<br> В течение 5 минут мы Вам перезвоним" data-params="">
<pre>{{dataAttr}}</pre>
</div>
$root.$attrs
. Но я бы, все-таки, положил их в store и доставал оттуда