Quiero transformar el valor de entrada del elemento de entrada en un Objeto
usar Json.parse() para convertir el valor internData de datos no convierte la cadena en un objeto
hacer la misma operación en la consola del navegador devuelve el resultado correcto.
let data = "[1,2,3,4]"; JSON.parse(datas) (4) [1, 2, 3, 4] typeof z 'object'Que me estoy perdiendo aqui ?
new Vue({ el: "#app", data() { return { datatype: "foo", internData: "[1, 2, 3]", }; }, methods: { transformData() { // // JSON.parse(this.internData); // this.internData.push(12); return this.internData; }, whatFormat(){ console.log(typeof this.internData) } }, }); <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script> <html> <body> <div id="app"> <h5> {{ data }}</h5> <input v-model="internData" @input="onInputme" /> <button type="button" @click="transformData">click to transform</button> <button type="button" @click="whatFormat">what data type</button> </div> <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script> </body> </html>El problema que tiene actualmente es que no está actualizando internData desde la función transformData , debe reasignar internData con el mismo formato analizado JSON dentro de la función, como se muestra a continuación.
transformData() { this.internData = JSON.parse(this.internData); }O
Podría hacer transformData como una propiedad calculada y observar el tipo de transformData . Aquí puede deshacerse del evento de clic para analizar los datos.
new Vue({ el: "#app", data() { return { datatype: "foo", internData: "[1, 2, 3]", }; }, methods: { whatFormat() { console.log(this.transformData); console.log(typeof this.transformData); } }, computed: { transformData: function () { return JSON.parse(this.internData) } } }); <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script> <div id="app"> <input v-model="internData" /> <button type="button" @click="whatFormat">what data type</button> </div>Su función transformData transforma la cadena, pero el objeto recién creado no está asignado a la propiedad internData.
Esto debería funcionar:
transformData() { this.internData = JSON.parse(this.internData); },