He estado buscando durante horas sin tener idea de lo que estoy haciendo. Estoy usando Vue Treeselect dentro de mi aplicación js.
Aquí está el código que estoy usando:
<script src="js/vue@^2"></script> <script src="js/vue-treeselect.umd.min.js"></script> <link rel="stylesheet" href="css/vue-treeselect.min.css"> <div id="treeselect_container"> <treeselect id="treeselect_test" name="treeselect_test" @input="onInput" v-model="value" :multiple="false" :options="options" placeholder="Select Content..." /> <script> Vue.component('treeselect', VueTreeselect.Treeselect) new Vue({ el: '#treeselect_container', data: { value: null, options: [ { id: 'a', label: 'a', children: [ { id: 'aa', label: 'aa', }, { id: 'ab', label: 'ab', } ], }, { id: 'b', label: 'b', }, { id: 'c', label: 'c', } ] }, methods: { onInput(value, id) { console.log(value, id); } } }) </script> </div>
Básicamente, estoy usando el método onInput
para obtener el valor para su uso posterior, pero lo que me confunde es cómo puedo seleccionar un valor determinado de la selección de árboles vue.
Descubrí que cambiar el value: null
por ejemplo, a value: a
cambia el valor, pero las formas con las que estoy familiarizado son recargar la página y usar datos de sesión o datos de publicación de PHP. Pero eso es muy complicado, sé que hay muchas formas más simples de hacerlo, pero no pude encontrarlas.
Soy nuevo en Vue y este es el único fragmento de código que agregué a mi página, todo lo demás es PHP mezclado con jquery y js simple. Cualquier ayuda va un largo camino. Gracias.