* Saludos amigos de Stackoverflow.
Estoy desarrollando mi primera aplicación Vue y tengo problemas con el uso de la función de búsqueda para recorrer mi lista de metales y extraer el valor de Gravedad específico en función de un accesorio de tipo coincidente. Parece que la lista está fuera de alcance y no puedo encontrar una solución a través de Google, así que me dirijo a todos ustedes.
AIT*
Error:
"vue@next:1751 Error de referencia no capturado: los datos no están definidos en Proxy.calc (index.html:101:45) en onClick (eval en compileToFunction (vue@next:15591:23), :142:35) en callWithErrorHandling ( vue@next:1688:24) en callWithAsyncErrorHandling (vue@next:1697:23) en HTMLButtonElement.invoker (vue@next:9486:15)"
<script> var app = Vue.createApp({ data: function() { return { waxWeight: null, isVisible: true, buttonSize: null, specificGravity: null, metalType: null } }, // <!-- COMPONENTS --> components: { }, // <!-- METHODS --> // `this` inside methods point to the current Vue instance methods: { calc: function (waxWeight, buttonSize, metalType) { var waxWeight = waxWeight var buttonSize = buttonSize var metalType = metalType var metals = {metals:[ { type: 'silver', specificGravity: 10.3 }, { type: 'wGold14', specificGravity: 12.1 }, { type: 'wGold18', specificGravity: 11.5 }, { type: 'yGold14', specificGravity: 13.6 }]} // method does not have access to data list const specificGravity = data.metals.find(function(elem){ if(elem.name == metalType) return elem.specificGravity; alert(metalType) }); } }, }) app.mount('#app') </script>Problema inicial resuelto aquí: https://codepen.io/pandemicprogrammer/pen/GROWqwR
Estaba haciendo referencia al objeto de matriz incorrectamente y tenía mis datos JSON en el lugar equivocado.
methods: { calc: function (waxWeight, buttonSize, metalType) { alert("test") var waxWeight = waxWeight var buttonSize = buttonSize var metalType = metalType var metals = {metals:[ { type: 'silver', specificGravity: 10.3 }, { type: 'wGold14', specificGravity: 12.1 }, { type: 'wGold18', specificGravity: 11.5 }, { type: 'yGold14', specificGravity: 13.6 }]} const specificGravity = metals.metals.find(function(elem){ if(elem.type == metalType) { alert(elem.specificGravity) return elem.specificGravity; } }); } },No estoy seguro de lo que está tratando de hacer en esta función, pero intentaré ayudarlo.
El problema es que no se puede acceder a los datos de esa manera, los datos son una función que devuelve un objeto JSON. Así que imagine que desea acceder al isVisible declarado en los datos. this.isVisible .
Sin embargo, no puedo entender por qué necesita acceder a los datos allí. Parece que desea acceder a la matriz dentro del objeto json, así que intente metals.metals.find(...) . Y si desea acceder a los metales de la matriz, cuando llama a elem.name, siempre quedará indefinido, ya que esta no es una clave del objeto, debe usar elem.type en su lugar. Aquí hay un lápiz de código que hice para ti para ejemplificar lo que estoy diciendo
Perdón por la respuesta larga, si esto no te ayuda, proporciona más contexto para que pueda ayudarte.