¿Cómo puedo obtener la longitud de un objeto json en vue?
Uso axios para publicar una palabra clave en mi script PHP que devuelve JSON así:
1: {image: "cms/images/producten/universele-folie/thumbnail/orajet_folie_wit.jpg",…} 2: {image: "cms/images/producten/wrap-cast/thumbnail/wrap.jpg", title: "Wrap folie",…} 3: {image: "cms/images/producten/transparante-folie/thumbnail/orajet_folie_transparant.jpg",…} 4: {image: "cms/images/producten/zandstraalfolie/thumbnail/materiaal-folie-zandstraalfolie.png",…} 5: {image: "cms/images/producten/vloerfolie/afbeeldingen/544_587cdea0a62b4429_2.jpg",…} 6: {image: "cms/images/producten/easy-folie/afbeeldingen/easy_dot.jpg",…}Quiero limitar este objeto para que cuando lo repita, se detenga en 6. Pero no tengo ni idea de cómo obtener la longitud de este objeto, ¿cómo puedo ver que hay resultados en el ejemplo 6 anterior?
.length pero esto no funciona en objetos. He intentado .keys como en el siguiente ejemplo:
let app = Vue.createApp({ data: function(){ return{ // Object to fill with JSON response responsedata:{}, showResultDiv: false } }, methods:{ // Function to show loading dots until json returned loadDiv(condition, content){ this.showResultDiv = condition }, async fetchResults(){ await axios.post('includes/searchproducts_json.php', { // Post data, add value of input to searchterm searchterm: this.$refs.searchterm.value }) .then((response)=>{ this.responsedata = response.data console.log(this.responsedata.keys) }) .catch((error)=>{ console.log(error) }) } }, computed: { } }) app.mount('#v_search'); Pero esto solo registra undefined . ¿Cómo puedo limitar este objeto? Preferiblemente, cree 1 objeto para realizar un bucle con solo 6 resultados y un objeto de datos que contenga el número de todos los resultados.
Puede usar el Método 1: Object.keys(yourObject)
Object.keys(this.responsedata).lengthSin embargo, este método tiene sobrecarga de memoria y sería más lento que el Método 2
Método 2: for-loop
let objectSize = 0; for(let k in this.responsedata) { objectSize++ } // objectSize here holds the size of your object return objectSizeEstos métodos serían un poco más rápidos debido a un mejor uso de la memoria.
Como señaló @Simon K, puede consultar más aquí