Accessing an object property in JS

Question

I'm currently working on a blog and I'm kinda stuck I need some help!

When the user creates an article, he can set a special tag to push an article on top of the website through the property "position". So article.position can be equal to "first", "second", "third" or "none" (which is the default placement) depending on what the user sets.

Here is the method for creating an article with axios :

addArticle() {

  axios.post('http://localhost:4000/articles', {
     title: this.title,
     description: this.description,
     content: this.content,
     position: this.position,
    })

     .then(function (response) {
       console.log(response);
     })
     .catch(function (error) {
       console.log(error);
      });
   },

Everything is working perfectly, but here is the problem :

When a user creates an article with a special position, if an article is already set to the same position, I want it to be replaced by the new article that the user just set.

For example: An old Article A has position == "first" . The user is creating a new Article B and he wants Article B to go at the top, he sets position == "first" . Article A position should be now set as "none".

Important note : articles are located on a Vuex store.

Here is what I tried, in the addArticle method above the axios request :

if (article.position == "first") {

  let articlesList = this.$store.state.articles

  for (var i = 0; articlesList.length; i++) {
    if(articlesList[i].position == "first")
      articlesList[i].position == "none"
  }
}

I'm a rookie so, it might have a lot of mistakes, what am I doing wrong?

Thank you for your time!

Answer 1

  if (article.position === 'first') {

    let articlesList = this.$store.state.articles;

    for (i = 0; i < articlesList.length; i++) {
      if(articlesList[i].position === 'first')
        articlesList[i].position = "none"
    }
  }

I am just making smallest changes possible without mentioning best practices and stuff.