Obtain unique identifiers for the purpose of sorting the items

While utilizing Nuxt.js, I am fetching random images from URLs structured like this: 

http://www.randomimage.com?ID=myId

To display 2 pictures, I use the following methods: 

getRandomArbitrary(min, max) {
  return this.numb = Math.floor(Math.random() * (max - min) + min)
},
addImage() {
  let img = document.getElementById('img')
  img.src = 'http://portailservices/portail/fichier.php?LI=' +  this.getRandomArbitrary(20, 700);
},

My objective now is to allow visitors to upvote one of the two pictures and store their choice in the local storage to create a ranking system.

The challenge I'm facing is how to effectively store the randomly generated IDs obtained.

javascriptvue.js

Answer №1

In my opinion, a more efficient approach would be to create a parent function that generates two random numbers which are then stored in local storage. Subsequently, you can call your functions with a parameter. It could look something like this:

function generateSaveDisplay() {
  let randomNumber1 = generateRandom(1,10),
      randomNumber2 = generateRandom(1,10);
  saveDataToStorage({userID: 1, numList: [randomNumber1, randomNumber2]});
  displayResult(randomNumber1);
  displayResult(randomNumber2);
}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the reason behind having 3 watchers for 1 binding in AngularJS?

Take a moment to view the screenshot provided below In the screenshot, it is evident that there are #3 watchers for a single binding. Would someone care to explain the reason behind this? P.S: I am utilizing AngularJS Batarang to assess performance. ...

javascriptangularjsangularjs-watchangularjs-bindings

Ways to Toggle div Visibility for Elements with Identical Class Names on an Individual Basis

After searching for solutions on stackoverflow, I attempted to implement some answers provided by other users, but I'm still not achieving the desired outcome. In my website's about section, there are four different items. When a specific item&a ...

javascriptjqueryhtmlcss

What is the best way to obtain a direct file link from a server URL using JavaScript?

After acquiring a file located at /home/johndoe/index.html, I am utilizing a tool like XAMPP to host, with the folder /home being hosted on localhost. The variables in play are as follows: $server_addr = "localhost"; $server_root = "/home"; $file_dir = " ...

javascriptphphtmlajax

What is the correct way to set up Vuetify on a Rails project?

Javascript Issue: [Vuetify] Encountered multiple Vue instances which led to errors. Check out https://github.com/vuetifyjs/vuetify/issues/4068 If you're facing the error "$attrs is readonly", it is due to: consoleError @ vuetify.js:22001 install @ ...

ruby-on-railsvue.jsnpmyarnpkgvuetify.js

JavaScript: Trouble with statement execution

My code is designed to classify a point as 1 if it's above the line y=x, and -1 if it's below the line y=x. I visually represent this line in a canvas by plotting y=x (although due to invertion on the y-axis, it appears like y=-x). For each point ...

javascriptif-statementcanvas

Tips for minimizing the transfer time of large arrays using ajax

https://i.stack.imgur.com/IP0oe.pngDescription I am currently working on transferring a JSON object from the server to the client using PHP and JavaScript via AJAX. The JSON object contains a large array (200x200) of integers. The server is running on lo ...

javascriptphpajax

Triggering the open() function within an Ajax request

Upon experimenting with the method open(), I discovered that it requires a URL file as an argument. For instance, I have two functions named generateGeometricShapes() and colorShapes(). I am contemplating whether I should create separate files for each fu ...

javascriptphpajax

From JSON to PNG in one simple step with Fabric.js

I am looking for a way to generate PNG thumbnails from saved stringified JSON data obtained from fabric.js. Currently, I store the JSON data in a database after saving it from the canvas. However, now I want to create a gallery of PNG thumbnails using thi ...

javascriptjqueryjsonfabricjs

React is unable to identify the `justifyContent` property on a HTML element

const anotherStyle = makeStyles((theme) => ({ container:{ margin: 10, textAlign: 'center', display: 'flex', }, })); return ( <Container className={anotherStyle.container}> <div className={classes.ro ...

javascriptreactjsmaterial-ui

Mongoose: No documents are being returned by the .find() method

UPDATE : Similar question posted here: Trouble with Mongoose find() method I'm still new to working with nodejs and nosql databases. Today, I am building an API that retrieves data from my user collection which currently has two entries : The issue ...

javascriptnode.jsmongodbexpressmongoose

Steps for creating a new tab and refreshing the address bar with a different URL without having to reload the current page

I'm trying to create a functionality on my page where clicking a button will open a new tab with a modified URL, all without reloading the current page. Below is the code that I'm using when the button is clicked: function changeUrl(){ var pri ...

javascriptangularjshtml

What is the reason behind the length property belonging to an array object?

While there are other instances, let's focus on the length property for now. Why does it appear as if we're copying it here: [].hasOwnProperty("length") //==> true It is common knowledge that an array's length property belongs ...

javascriptinheritanceprototype-chain

Having trouble displaying the Primevue dialog modal in Vue 3?

I am using [email protected] and [email protected] Main script import { createApp } from 'vue' import App from './App.vue' import router from './router' import PrimeVue from 'primevue/config'; import &apos ...

javascriptvue.jsvuejs3primevue

Is it an error to pass arguments using square brackets when requiring a node module?

Recently, I came across this piece of nodeJS code on a GitHub repository: var env = process.env.NODE_ENV || 'development' , config = require('./config/config')[env] , auth = require('./config/middlewares/authorization') , mon ...

javascriptnode.js

Error: Unable to access 'author' property as it is undefined

Currently, I am in the process of learning how to create my own blog by following a tutorial on Github. The tutorial can be found at https://github.com/adrianhajdin/project_graphql_blog. However, while working with [slug].js to build localhost/3000/post/re ...

javascriptreactjs

Verify if the user is currently active

Is there a method to determine if the user is not active? I am currently utilizing raw PHP. I would like for the user to be automatically logged out once they close the window, indicating their inactivity. I attempted implementing window.addEventListener ...

javascriptphp

What is the best way to hide a custom contextmenu in AngularJs?

I created a custom contextmenu directive using AngularJs. However, I am facing an issue where the menu is supposed to close when I click anywhere on the page except for the custom menu itself. Although I have added a click function to the document to achie ...

javascriptjqueryangularjscontextmenu

Using Vue.js, send information from an Ajax request to a Laravel controller for processing

As someone new to development, I have a little confusion with handling data from a multi-step form in an AJAX request on my controller. While I've been able to successfully collect all form inputs at once, I'm struggling to use the data from $req ...

javascriptvue.jsaxios

Update the color of buttons after being clicked - Bootstrap

If I want to change the class "btn-success" to "btn-warning" or update the color code to "#ffc107" upon a successful process, how can I achieve that? Button ; <button type="submit" name="teklifver" value="Teklif Ver" class="btn btn-block btn-success" ...

javascriptbootstrap-4

What is the best way to run JavaScript code using Python Selenium, and then retrieve the results within my Python script?

After searching for solutions, I came across a Python code snippet that opens my JavaScript file and runs it on the webpage. I stumbled upon discussions about using execute_async_script() to manage callbacks in JavaScript, but the concept still eludes me. ...

javascriptpython-3.xselenium-webdriver