creé un componente vue y necesito que cuando el usuario en el html declara el componente, pueda escribirle un JSON como atributo (que es el contenido que usa otra libreria). El tema es que un json como atributo no es muy amigable y pensé en que se pueda enviarle un nodo hijo con la data como innerHTML y que cuando el componente realiza el mounted sacar la data de ese hijo, sin embargo no encuentro la forma de acceder al elemento desde el cual se construyó el componente. ¿Alguna sugerencia o alternativa?
Algo así sería la idea (probe con ref pero no la puedo acceder)
<element dir="where/st02">
<div ref="content">
{"data" : "hola"}
</div>
</element>
Vue.component('element', {
template: '<div id="elem-div"></div>',
props: ['dir'],
mounted: function() {
// this.content.innerHTML?
},
beforeMount: function() {
}
});
var app = new Vue({
el: '#app'
});